jQuery li click失效问题
转自:http://blog.sina.com.cn/s/blog_64008ed70101nyoz.html
项目中使用到jQuery脚本插入一段代码,然后给代码加事件,但是click事件失效,网上找原因说是jQuery只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定.
代码如下:
<div class="hotel_info_pic" id="imgDiv">
<ul id="imgUl"> </ul>
</div>
<div id="alertDiv" style="display:none;">
<p>测试文字</p>
</div> <script type="text/javascript">
$(document).ready(function(){
var temp="<li>111</li><li>222</li><li>333</li>";
$("#imgUl").append(temp);
$("#imgDiv ul li").click(function(){
$("#alertDiv").show();
});
});
</script>
点击li没有任何反应,然后改成live,一切OK.
<script type="text/javascript">
$(document).ready(function(){
var temp="<li>111</li><li>222</li><li>333</li>";
$("#imgUl").append(temp);
$("#imgDiv ul li").live('click',function(){
$("#alertDiv").show();
});
});
</script>
jQuery li click失效问题的更多相关文章
- jquery - ul li click  无响应
		
搞了很久, 发现对应jquery来说, 动态产生的ul li(其实不只是这个, 还有 table td等), 直接使用 $("#ul_div>li").click(funct ...
 - jquery绑定事件失效的情况(转)
		
原文地址:http://www.thinksaas.cn/group/topic/348453/ jQuery中文api地址:http://www.jquery123.com/api/ jQuery官 ...
 - JS:   javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题
		
javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...
 - vue li click
		
<ul> <li @click="mechanisms(1)">AAAAA</li> <li @click=" ...
 - 2.26 js解决click失效问题
		
2.26 js解决click失效问题 前言有时候元素明明已经找到了,运行也没报错,点击后页面没任何反应.这种问题遇到了,是比较头疼的,因为没任何报错,只是click事件失效了.本篇用2种方法解决这种诡 ...
 - 关于jquery的click()方法
		
昨天,有个同事研究了以下jqury的click()方法,代码如下: <!DOCTYPE html> <html> <head> <meta charset=& ...
 - jquery 自定义click事件执行多次
		
用jquery绑定一个按钮click事件后,第一次点击后一切正常,第二次点击竟然执行两次,以后越来越多, 后来查看文档发现 jquery click 不是替换原有的function 而是接着添加,所以 ...
 - JQuery实现click事件绑定与触发方法分析
		
原生JS通过什么方法绑定click事件? 原生js有一下三种方法为DOM对象绑定click事件, 第一种,在html中添加 onclick属性,在此属性中添加要绑定的事件函数,如下, 这种方法为htm ...
 - jquery <li>标签 隔若干行 加空白或者加虚线
		
$(function () { $('ul li').addClass(function (i) { return i % 6 == 5 ? "ab" : "" ...
 
随机推荐
- CentOS 6.7下配置 yum 安装 Nginx
			
CentOS 6.7下配置 yum 安装 Nginx. 转载:http://www.linuxidc.com/Linux/2016-07/133283.htm 第一步,在/etc/yum.repos. ...
 - idea中使用FindBugs-IDEA插件
			
下载 - 安装 - 重启idea即可: 项目右键或者文件右键即可看到 FindBugs 选项. 选择某个选项直接检测即可.检测结果如下图: 这里的Correctness是重点关注对象.这里面的错误往 ...
 - Crontab 在linux中的非常有用的Schedule Jobs
			
crontab 是linux系统集成的定时任务命令,它对于系统运行(数据的备份,调度系统资源或命令,程序的定时触发等非常有用).crontab有些类似于Windows系统的Service的任务计划程序 ...
 - HashMap底层数据结构和算法解析
			
1.Hash Map的数据结构? A:哈希表结构(链表散列:数组+链表)实现,结合数组和链表的优点.当链表长度超过8时,链表转换为红黑树. transient Node<K,V>[] ta ...
 - 读书笔记(高性能javascript)(一)
			
1.加载与执行: (1)将脚本放在底部:(否则会阻塞) (2)由于每个<script>标签初始下载时都会阻塞页面渲染,所以减少页面包含的<script>标签数量有助于改善这一情 ...
 - JavaScript之函数和this
			
一. 函数的内部属性 1. 在函数内部有两个特殊的对象: arguments: 类数组对象,包含传入函数中的所有参数.其有一个callee属性,该属性是一个指针,指向拥有这个arguments对象的函 ...
 - 并发系列6-Java并发面试系列文章总结【石杉的架构笔记】
 - win10安装mysql8.0.15
			
1:下载mysql8.0.15 https://www.mysql.com/downloads/ 2:下载完解压,增加my.ini配置文件 [mysqld] # 设置3306端口 port= # 设置 ...
 - iOS 带箭头菜单选项弹窗LFPopupMenu
			
一.效果图 由于是模拟器缩得比较小,一些细线可能显示不出来,不是bug哈. 二.用法 LFPopupMenuItem *item1 = [LFPopupMenuItem createWithTitle ...
 - Inno Setup自定义卸载文件名称的脚本
			
Inno Setup 支持在同一个目录中安装多个应用程序,所以根据安装的先后次序自动将卸载程序文件命名为 unins000.exe,unins001.exe,unins002.exe 等等.这是 IN ...