对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& ...
随机推荐
- ubuntu 切换JDK版本
安装: 第一种方式:sudo apt-get install openjdk-7-jdk(or openjdk-6-jdk) 第二种方式:tar -zxvf jdk-7u79-linux-x64.ta ...
- HDU -1864最大报销额(01背包)
这道题属于简单的01背包,但是背包问题还算简单,就是前面的细节处理的时候要注意,题意大致说了三条限制吧 1. 只有a, b, c 三种类型的发票可以报销,其它的一律不报销 2. 物品单项的报销额不超过 ...
- 以下各节已定义,但尚未为布局页“~/Views/Shared/_Layout.cshtml”呈现:“Scripts”。
以下各节已定义,但尚未为布局页“~/Views/Shared/_Layout.cshtml”呈现:“Scripts”. 报错内容如下: 解决办法如下: 1.在_Layout.cshtml布局body内 ...
- JAVA彩色图片变灰处理
File file = new File("F:/firefox.png"); File destFile = new File("F:/pic/" + Sys ...
- FFMPEG 视频旋转设置
fmpeg -i inputfile.mp4 -vf "transpose=1" outputfile.mp4 0=90CounterCLockwise and Vertical ...
- 最近很火的携程Java 工程师的一道面向对象面试题
最近这道面试题,传遍程序员各大小园地,本小白特摘抄整理与大家一起学习: 原题: package com.gxlee; public class Base { private String baseNa ...
- Autofac 一个使用Demo
一:接口 二:实现: 三:调用: 首先上图: 一:接口代码 public interface IPersonDa { PersonEntity Get(int id); } 二:实现 public c ...
- 进阶C#?
玩了几年的编程了,大四了.本来不想考研,我老师找我谈几次,最近准备考研.从一开始玩java,接触.net中的C#,aps.net,到接触linux,太多太多了. 本来我们专业不是纯计算机的,但是和计算 ...
- 使用CAEmitterLayer实现下雪效果
效果图: 代码部分: #import "ViewController.h" @interface ViewController () @end @implementation Vi ...
- java日期处理总结(二)
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAzUAAAG1CAIAAABPoU1KAAAgAElEQVR4nOy9e1xU1d747znP9/V9nu