jquery 当前链接激活传递参数|div的切换显示

时间:2023-03-08 16:56:20

一、链接激活时传递参数

$("a").click(function(){
var obj=$(this).attr("field"); //获取当前field 参数值
alert(obj);
}); <ul>
<li><a href="#1"field="">第一段</li>
<li><a href="#2" field="">第二段</li>
</ul>

二、获取url参数值

 function getUrl(para) {
var paraArr = location.search.substring(1).split('&');
for (var i = 0; i < paraArr.length; i++) {
if (para == paraArr[i].split('=')[0]){
return paraArr[i].split('=')[1];}
}
return '';
} 参数url举例 index.php?id=101&regiionId=120000&long=103.36&lati=39.25
解析参数方法 var long=getUrl(long);

div的切换显示:

<style type="text/css">
ul { list-style-type:none;margin:;padding:;}
li { float:left;}
a:link,a:visited { display:block;width:120px;background-color:#e6e6e6;}
a:hover { background-color:#;}
a:active { background-color:red;}
</style>
<script>
$(document).ready(function(){
$("#type1").hide();
$("#type2").hide();
$("button").click(function(){
});
$("a").click(function(){
var obj=$(this).attr("field");
//重点
$(obj).show();
$(obj).siblings().hide();

});
});
</script>
</head> <body>
<div>
<ul>
<li><a href="#1"field="#type1">第一段</li>
<li><a href="#2" field="#type2">第二段</li>
</ul> <div>
<div id="type1" style="height:400px;background-color:red; ">hello wo shi yi </div>
<div id="type2" style="height:400px;background-color:blue;">er </div><br/>
</div>
<button>点我</button>
<a id="test" href="http://#">首页</a>
</div>
</body> </html>