对Ul下的li标签执行点击事件——如何获取你所点击的标签

问题所来:做项目时,一般的数据都是用循环动态加载出来的,结构都是一样的,只是绑定的值不同,如何对相同的标签做处理的问题就来了。

例如:点谁就显示谁的数值

<ul id="test">

 <li class="test">1</li>

 <li  class="test">2</li>

  <li  class="test">3</li>

  <li  class="test">4</li>

</ul>

 

1解:   如果没有class属性的时候   

 在相同的标签外部(随便找一个即可,需要包裹所有的相同标签)  

( ul包裹了所有的li, on里面的 第一个参数:需要的做的事件类型,第二个参数:对谁做 执行这个事件的对象)

 对于ul中的li

$("ul#test").on("click","li",function(){      //只需要找到你点击的是哪个ul里面的就行

     alert($(this).text());
 });

对于表格中的td

<table class="display" id="example" cellspacing="0" width="100%">
<thead>
<tr> <th>型号编号</th> <th>型号名称</th> <th>型号描述</th> <th>创建时间</th>  <th>操作</th> </tr>
</thead>
<tbody>
<tr> <td>1</td> <td>车子</td> <td>描述</td> <td>2016/11/15</td>  <td> <button id='delrow' type='button'>删除</button> </td> </tr>
<tr> <td>2</td> <td>衣服</td> <td>描述2</td> <td>2016/11/16</td>  <td><button id='delrow' type='button'>删除</button></td> </tr>
</tbody>
</table>
$('#example tbody').on('click', 'button#delrow', function () {
     var tt = $("#example").DataTable();
      tt.row($(this).parent('tr')).remove();  //删除你点击的行

   });

  2解:有class属性    通过循环来做

$(".test").each(function(){
    alert( $(this).text());
});

  3解:有class属性

 

$(".test").click(function(){
    alert( $(this).text());
});

  

挺有意思的一个小问题 虽然不难  但想了好一会 写不出来的时候才意识到自己太依赖搜索引擎 基本功都忘了

还有一段小插曲

出现这个问题是因为Jquery版本问题 这是个老项目 jquery版本太低不支持on 方法 升级就好了

 

原文链接 https://www.cnblogs.com/Sea1ee/p/6204596.html

 

转载于:https://www.cnblogs.com/zhangxiaoxia/p/10820765.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值