对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& ...
随机推荐
- linux系统用户锁定与解锁
1.使用passwd命令锁定与解锁账号 [root@rhel7 ~]# passwd -l lxj --- -l 锁定 Locking password for user lxj. passwd: S ...
- Environment Configuration Files
Environment Configuration Files When a user logs in, an environment is created for that user automat ...
- GSON 示例代码 实用版
去除所有格式的json字符串 {"data":[{"friend":[{"address":"广州","nam ...
- SpringMVC08转发和重定向
public class User { private String name; private Integer age; public String getName() { return name; ...
- poj 1964 Cow Cycling(dp)
/* 一开始想的二维的 只维护第几只牛还有圈数 后来发现每只牛的能量是跟随每个状态的 所以再加一维 f[i][j][k]表示第i只牛 领跑的j全 已经消耗了k体力 转移的话分两类 1.换一只牛领跑 那 ...
- mysql慢查优化总结
1.优化sql语句结构 or改成union,使用start,limit 先只查询出所有的id,然后再排序.如果查询出所有的id仍然很慢,就要仔细考虑了. 2.添加索引 mysql每次查询只能使用一个索 ...
- location.href的用法
*.location.href 用法: top.location.href=”url” 在顶层页面打开url(跳出框架) self.location.href=”url” ...
- PHP 执行系统外部命令 system() exec() passthru()
区别: system() 输出并返回最后一行shell结果. exec() 不输出结果,返回最后一行shell结果,所有结果可以保存到一个返回的数组里面. passthru() 只调用命令,把命令的运 ...
- 让 IE 支持HTML5 placeholder
HTML5 新增的placeholder属性已经得到现代浏览器的支持,旨在提供简单的API可以为文本输入框设置 描述输入字段预期值的提示信息(hint). 这是W3C在标准化的过程中对用户体验的更多考 ...
- 武汉科技大学ACM :1008: A+B for Input-Output Practice (VIII)
Problem Description Your task is to calculate the sum of some integers. Input Input contains an inte ...