如何使用jquery获取多个a元素的值

JPF1024 2014-06-04 04:18:40
html如下:


<div id='div'>

<a href="javascript:void(0)" name="a">百度</a>

<a href="javascript:void(0)" name="a">google</a>

<a href="javascript:void(0)" name="a">msn</a>

<a href="javascript:void(0)" name="a">qq</a>

<a href="javascript:void(0)" name="a">sina</a>

</div>





<div id='divs'>

<a href="javascript:void(0)" name="b">百</a>

<a href="javascript:void(0)" name="b">g</a>

<a href="javascript:void(0)" name="b">m</a>

<a href="javascript:void(0)" name="b">q</a>

<a href="javascript:void(0)" name="b">s</a>

</div>

js是这样写的:


<script type="text/javascript">

	var te = new Array();

	$("div a").bind("click", function() {

		//text=$(this).html();

		te[0]=$(this).html();

		alert(te[0]);

    //alert($(this).html());//index

});



$("divs a").bind("click", function() {

	//text+=$(this).html();

    te[1]=$(this).html();

	//alert(text);//index

	alert(te[0]+">>>>>>>>>>>>>"+te[1]);

	

});

</script>

用意是:点击a的时候直接查询,如果再次点击b就同时查询a和b[也就是第一次查询的时候要保存a的条件],

假设再次点击a，则重新查询,checkbox和radio我知道怎么去做，但是a就不知道怎么做了.

之前写了一个小例子,发现可以重复点击[我要的是不重复同一个查询条件],如下:



<a href="javascript:void(0)" onClick="show('&id=1')">123456</a><br />

<a href="javascript:void(0)" onClick="show('&id=2')">1234567</a><br />

<a href="javascript:void(0)" onclick="show('&id=3')">123455878</a><br />

<a href="javascript:void(0)" onclick="show('&id=4')">123456525</a><br />

<a href="javascript:void(0)" onclick="show('&id=5')">1235789452</a><br />

<a href="javascript:void(0)" onclick="show('&id=6')">12589575</a> <a href="javascript:void(0)" onClick="show('&id=1')">123456</a><br />

<a href="javascript:void(0)" onClick="show('&name=2')">1234567</a><br />

<a href="javascript:void(0)" onclick="show('&age=3')">123455878</a><br />

<a href="javascript:void(0)" onclick="show('&sex=4')">123456525</a><br />

<a href="javascript:void(0)" onclick="show('&color=5')">1235789452</a><br />

<a href="javascript:void(0)" onclick="show('&count=6')">12589575</a> <a href="javascript:void(0)" onClick="showe()" >show number</a> <br/>

<a href="javascript:void(0)" onClick="clears()" >clear</a>

<div id="number" style="font-size:20px;margin:20px;"> </div>

js如下:


<script type="text/javascript">

var sk = new Array();

var text = "";

 function show (is)

{

	text="";

	sk.push(is);

	

	for(var i=0;i<sk.length;i++)

	{

		text+=sk[i];

	}

	showe();

}



function showe()

{

	document.getElementById("number").innerHTML=text;

}



function clears()

{

	document.getElementById("number").innerHTML="";	

}



</script>

等大神,谢谢了.
...全文
663 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
Zangxjun 2015-07-18
  • 打赏
  • 举报
 回复
引用 3 楼 dcxy0 的回复:
[quote=引用 2 楼 yang_1224 的回复:] 少写了一行 

var query="",obj={};
  $(function(){
    $("#div a").on("click",function(){
      var str=$(this).html().trim();
      if(obj.hasOwnProperty(str)){
        query=str;//重新设定查询关键字
        obj={};
      }
      else{
        obj[str]=1;
        query+=str;//拼接查询关键字
      }
    });
  });



<html>
  <ul class="table-child" id="cityspr"> 
   <li>所在城市：</li> 
   <li id="showcity"><a href="javascript:void(0)">全部</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">巴中</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">南充</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">内江</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">眉山</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">绵阳</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">乐山</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">凉山</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">彝族自治州</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">广安</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">广元</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">成都</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">自贡</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">宜宾</a></li> 
   <li class="iconfont">Ʀ</li> 
  </ul> 
  <ul id="topicd" class="table-child"> 
  </ul> 
  <ul class="table-child"> 
   <li>价格：</li> 
   <li><a href="t?page=1&querynum=4&price=-1" name="ticketprice">全部</a></li> 
   <li><a href="t?page=1&querynum=4&price=1" name="ticketprice">¥0-¥50</a></li> 
   <li><a href="t?page=1&querynum=4&price=2" name="ticketprice">¥50-¥100</a></li> 
   <li><a href="t?page=1&querynum=4&price=3" name="ticketprice">¥100</a></li> 
   <li></li> 
  </ul> 
  <ul class="table-child"> 
   <li>级别：</li> 
   <li><a href="t?page=1&pageSize=4&level=0" name="level">全部</a></li> 
   <li><a href="t?page=1&pageSize=4&level=5" name="level">5A</a></li> 
   <li><a href="t?page=1&pageSize=4&level=4" name="level">4A</a></li> 
   <li><a href="t?page=1&pageSize=4&level=3" name="level">3A</a></li> 
   <li><a href="t?page=1&pageSize=4&level=-1" name="level">其它</a></li> 
   <li></li> 
  </ul>
实际源码是这样的,意思就是你说的那个意思,只是查询条件更多了，不过相同条件name是一样的,帮我看下吧，谢谢了。。。。[/quote]你解决没有
人生难得一只鸡 2014-06-04
  • 打赏
  • 举报
 回复
你应该是模拟下拉菜单的实现，最终实现数据提交查询 习惯把查询参数 整合到表单中，而模拟的部分 当事件触发的时候，那么只需要设置提交表单相应的参数值即可，最终还是以提交表单为准，而不用去管什么查询条件的拼接，后台只需要接受表单对应的参数即可。
JPF1024 2014-06-04
  • 打赏
  • 举报
 回复
引用 2 楼 yang_1224 的回复:
少写了一行 

var query="",obj={};
  $(function(){
    $("#div a").on("click",function(){
      var str=$(this).html().trim();
      if(obj.hasOwnProperty(str)){
        query=str;//重新设定查询关键字
        obj={};
      }
      else{
        obj[str]=1;
        query+=str;//拼接查询关键字
      }
    });
  });



<html>
  <ul class="table-child" id="cityspr"> 
   <li>所在城市：</li> 
   <li id="showcity"><a href="javascript:void(0)">全部</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">巴中</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">南充</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">内江</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">眉山</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">绵阳</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">乐山</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">凉山</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">彝族自治州</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">广安</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">广元</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">成都</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">自贡</a></li> 
   <li><a href="javascript:void(0)" name="city" class="getbycity" onclick="test($(this).text())">宜宾</a></li> 
   <li class="iconfont">Ʀ</li> 
  </ul> 
  <ul id="topicd" class="table-child"> 
  </ul> 
  <ul class="table-child"> 
   <li>价格：</li> 
   <li><a href="t?page=1&querynum=4&price=-1" name="ticketprice">全部</a></li> 
   <li><a href="t?page=1&querynum=4&price=1" name="ticketprice">¥0-¥50</a></li> 
   <li><a href="t?page=1&querynum=4&price=2" name="ticketprice">¥50-¥100</a></li> 
   <li><a href="t?page=1&querynum=4&price=3" name="ticketprice">¥100</a></li> 
   <li></li> 
  </ul> 
  <ul class="table-child"> 
   <li>级别：</li> 
   <li><a href="t?page=1&pageSize=4&level=0" name="level">全部</a></li> 
   <li><a href="t?page=1&pageSize=4&level=5" name="level">5A</a></li> 
   <li><a href="t?page=1&pageSize=4&level=4" name="level">4A</a></li> 
   <li><a href="t?page=1&pageSize=4&level=3" name="level">3A</a></li> 
   <li><a href="t?page=1&pageSize=4&level=-1" name="level">其它</a></li> 
   <li></li> 
  </ul>
实际源码是这样的,意思就是你说的那个意思,只是查询条件更多了，不过相同条件name是一样的,帮我看下吧，谢谢了。。。。
yang_1224 2014-06-04
  • 打赏
  • 举报
 回复
少写了一行 

var query="",obj={};
  $(function(){
    $("#div a").on("click",function(){
      var str=$(this).html().trim();
      if(obj.hasOwnProperty(str)){
        query=str;//重新设定查询关键字
        obj={};
      }
      else{
        obj[str]=1;
        query+=str;//拼接查询关键字
      }
    });
  });
yang_1224 2014-06-04
  • 打赏
  • 举报
 回复
你的需求应该是点击a之后查询一次，再点击b之后，将a和b的查询关键词拼接再查询，再点击c时再拼接。但是如果再次点击了a则重新查询对吧？？ 

var query="",obj={};
  $(function(){
    $("#div a").on("click",function(){
      var str=$(this).html().trim();
      if(obj.hasOwnProperty(str)){
        query=str;//重新设定查询关键字
        obj={};
      }
      else{
        query+=str;//拼接查询关键字
      }
    });
  });
jQuery EasyUI 1.4 离线简体中文API文档 含完整开发工具包+皮肤+扩展+演示
（题外话：从本次开始 我新增了jQuery EasyUI的专题...filebox：filebox 该组件表单元素中用于上传文件的文件框工具组件 ">（题外话：从本次开始 我新增了jQuery EasyUI的专题页面 大家可以关注我的专题页来及时获取
jquery获得当前元素父级元素_如何使用jQuery获取父元素
jQuery获取父元素我们有三种方式可以实现，.parent()、.parents()、.closest()，下面我们将介绍jQuery获取父元素的这三种方式以及一个具体的示例。web前端学习：打造全网web前端全栈资料库(总目录)看完学的更快，...
jQuery入门到精通
课程列表如下：01_jQuery简介02_jQuery事件03_jQuery事件04_jQuery隐藏_显示05_jQuery滑动06_jQuery动画07_jQuery停止动画08_jQuery回调方法_链调用09_jQuery属性值操作10_jQuery添加元素11_jQuery操作样式12_...
jquery获取多个input元素属性值
$(function(){ $("input[type='number']").each(function(index,item){ var name = $(this).attr("... //获取name值 var val = $(this).val(); //获取value值 }); }); 表示获取...
jquery获取多个class的元素
需求： 获取删除div的id 删除 方法： $(".list-li.active").find(".btn").attr('id'); ... 交集选择： $(".a.b")--选择同时包含a和b的元素。...并集选择：$(".a, .b")--选择包含a或者包含b的元素
JavaScript

87,908

社区成员

224,616

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章