对Ul下的li标签执行点击事件——如何获取你所点击的标签
问题所来:做项目时,一般的数据都是用循环动态加载出来的,结构都是一样的,只是绑定的值不同,如何对相同的标签做处理的问题就来了。
例如:点谁就显示谁的数值
<ul >
<li id="test" class="test1">1</li>
<li id="test" class="test1">2</li>
<li id="test" class="test1">3</li>
<li id="test" class="test1">4</li>
</ul>
错误:这种做法永远只能取到第一个
$("#test").click(function(){
alert($(this).text());
});
1解: 没有class属性的时候
在相同的标签外部(随便找一个即可,需要包裹所有的相同标签)
( ul包裹了所有的li, on里面的 第一个参数:需要的做的事件类型,第二个参数:对谁做 执行这个事件的对象)
对于ul中的li
$("ul").on("click","li#test",function(){
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).parents('tr')).remove(); //删除你点击的行
});
2解:有class属性 通过循环来做
$(".test").each(function(){
alert( $(this).text());
});
3解:有class属性
$(".test").click(function(){
alert( $(this).text());
});
对Ul下的li标签执行点击事件——如何获取你所点击的标签的更多相关文章
- jquery选择div下的ul下的li下的a
使用jQuery选择器: $("div#div的id ul li a")//选择的是div下 ul下所有li下的所有a标签 $("div#div的id").ch ...
- 遍历ul下的li,点击弹出li的索引
首先我们需要一个html结构 <div > <ul> <li>a</li> <li>a</li> <li>a< ...
- js点击事件防止用户重复点击执行
点击事件里给button标签加一个自定义属性,存上次点击时间 追问: 求详细代码,JS 真心的没怎么做过 追答: <input type="button" id=&quo ...
- 关于<ul> 下的 <li> 里面的<a> 标签字体颜色不能控制
1.元展示 <ul class="ul"> <li><a href="#">菜单一</a></li> ...
- 为所有的Ul下的li标签添加点击事件
- jquery,javascript -设置某一ul下的li下的 a的属性
//javascriptvar ul = document.getElementById('ul); var as = ul.getElementsByTagName('a'); for(var i ...
- 问题:FF中把UL下的LI设为左浮动UL的背景色就没有了?
因为容器的子元素设置浮动后, 内容移出了文档流! 解决办法: 1.给个overflow:hidden;作为闭合浮动元素2.设定UL 一个固定的高度 下面是一些与之相关的解决办法,参考文章<那些 ...
- 给ul下的li加click时间
$('.province ul li').click(function() {//方法 });
- ul下的li浮动,如何是ul有li的高度
此时ul展示的界面为: ①给ul加上一个样式,display:inline-block; <html> <head> <title>float</title& ...
随机推荐
- Android Back Home键监听
Android Back Home键监听 Back键的监听 对于Back键的监听比较容易,可以在多个系统回调处拦截,比如在activity的下列方法中都可以收到Back键按下的事件: @Overrid ...
- codevs 2494 Vani和Cl2捉迷藏
/* 一开始大意了 以为和bzoj上的祭祀是一样的(毕竟样例都一样) 这里不知相邻的点可以相互到达 间接相连的也可以到达 所以floyed先建立一下关系 再跑最大独立集 下面贴一下95 和 100的代 ...
- mysql source命令导入sql文件效率分析和索引整理
Query OK, 24918 rows affected (0.90 sec)Records: 24918 Duplicates: 0 Warnings: 0 Query OK, 24923 r ...
- java中的final, finally, finalize的区别
final修饰符(关键字),如果一个类被声明为final,意味着它不能再派生出新的子类,不能作为父类被继承.因此一个类不能既被声明为abstract的,又被声明为final的.将变量或方法声明为fin ...
- Ubuntu桌面版与服务器版有什么不同?
提到安装Linux,Ubuntu可谓是最受欢迎的.为了满足每个人的需求,出现了不少版本或风格的Ubuntu;其中两项便是桌面版与服务器版.只要发布版本号一致,这两者从核心来说也就是相同的,唯 ...
- 软件测试 homework1
申明数组变量后,在使用的时候,出现了向上溢出的情况(程序运行过程中出现的),导致最后答案不正确,经过输出数组数据发现错误, 现在在申明数组的时候都会大致估算一下,确认申明什么样的数组不会导致溢出. 在 ...
- oracle 空置排在最后显示
nulls last select * from emp order by comm select * from emp order by comm desc select * from emp or ...
- Caused by: org.apache.ibatis.ognl.OgnlException: source is null for getProperty(null, "mil_id")
今天在使用mybatis处理数据库的时候,突然抛出了上述异常,让我感到很惊讶,因为在处理save的时候,在Mybatis的配置文件中,我根本就没有使用到ognl表达式,系统怎么会抛出上述异常.而且之前 ...
- IE9的BUG?jQuery的BUG?
本文转载自http://big-student.iteye.com/blog/1898213 在IE9和IE10中,当对一个html的样式初始了一个很大的left或者top时,使用jQuery的off ...
- php本页面调试报错配置
ini_set('display_errors', 'On'); ini_set('memory_limit', '64M'); //报错,详细 error_reporting(E_ALL); //不 ...