最近因为工作关系又重新回归到了jquery的怀抱,发现很多jquery的一些细节处理的部分都忘记了.这里记录一下最近在做项目时频繁遇到的一个问题:给异步加载的元素添加事件绑定. 问题发生的前提是项目前端开发使用了jquery 和 artTemplate技术,其中经常要通过artTemplate的template.compile()方法来实现像是向下滚动鼠标动态加载后续分页的内容并显示在页面上这样的效果. 在jquery官网上关于事件绑定和事件委托的4个方法中有这样的介绍: live():jQue…
/** 这种写法:在重新加载数据后事件依然有效*/$(document).on('click', '#district_layer ul li', function () { });…
jquery:为动态加载的元素添加点击事件 最近在做项目的时候遇到了这样一个问题,给用ajax动态加载出来的内容添加点击事件,但是怎么都触发不了,经过查询试验总结出正确的写法 在jquery1.7之前的版本中用的是live()方法,但是live()方法在1.7中已经不建议使用,1.9中删除了这个方法 live()方法适用于匹配选择器的当前及未来的元素(例如有脚本创建的新元素) 重点是自jquery1.7版本起,on()方法是bind().live().delegate()方法的新的替代品 on(…
为了实现如图所示的树状结构图,并使列表项可拖动到盒子里,研究了ztree这个插件的使用,并仔细研究了列表项的拖动事件.完成了预期需求,对jQuery的运用得到了提高.这个插件的功能非常强大,除了基本的简单树结构外,还支持自定义图标.自定义字体.单击节点控制.异步加载节点数据等多种扩展功能.本文只介绍一下基本树的实现,需要扩展功能的话,可以参考其API根据项目需求灵活展开工作.官网地址为:http://www.treejs.cn/v3/demo.php#_101 需求图 实现:首先我们先下载ztr…
1. 下载jquery的JS文件/ztree的CSS文件和JS文件 https://jquery.com/download/ https://gitee.com/zTree/zTree_v3/tree/master/ 2. 目录结构 3. asyncTree.html <head> <!-- 引入文件 --> <link rel="stylesheet" href="./resource/css/zTreeStyle.css" />…
问题描述 假设项目中有一个列表页面,如下: 当点击列表一行数据可以显示详情页面,而详情页面的数据是根据当前行的数据作为参数,通过 ajax 请求到后台返回的数据,再根据返回的结果动态生成 html 页面,如下: 但是,在动态生成的 html 页面中绑定点击事件运行无效 问题分析 在动态生成的 html 页面中绑定点击事件运行无效的原因,是因为这些动态加载的 html 页面(图二),是在列表数据页面(图一)的 html 元素.css.js 代码加载完后,再添加的 html 元素. 在浏览器解析到图…
本来要做一个文件目录浏览界面,需要遍历所有的文件和目录,很显然一次性读取时很费时费力的一件事情. 因此就需要做异步加载.... 不过网上的几篇帖子还挺坑的!原始参考:JQuery异步加载实例,相对来说这篇博客还算规整! springMVC中中文乱码问题:解决办法 准备工作 1 JQuery ZTree,下载地址 复制其中的JS和CSS即可,其实没必要引那么多,用什么引什么就可以. 2 需要fastJSON,用来转换JSON对象,下载地址 我下载JAR包后,引入到Eclipse中总是报找不到cla…
下面是使用zTree异步加载的一个例子: 1)初始化树的时候是ajax请求,返回nodes列表来初始化树的:如果一开始就异步的话,$.fn.zTree.init($("#zTree"),setting, data)第三个参数为null就行: 2)后面点击最末端的节点,比如点击单板的时候,开始异步加载: 我准备的nodes的数据结构:一会返回的node就是这样的格式,不过全部是string类型: var nodes = [ { 'id': 1, 'pid': 0, 'name': '硬件…
弄了很久却没有弄出来,感觉没有错,但是动态元素上的事件根本就不响应,代码如下: <input type="button" id="btnyes" value="确定" /> <div id="divcontent"> </div> <script> $(function () { $("#btnyes").on("click", funct…
最近在做项目的时候发现的一个问题,通过ajax动态加载出来的一个button值绑定不了点击事件.我使用的是datatables这款表单插件,表单内容是通过ajax动态渲染出来的. 解决方案: 通过Google,我发现在jquery1.7版本之前通常使用 .live() 这个事件,但是这个方法在1.9版本被移除了 所以,我们需要找一个替代的方法 .on(),首先让我们先来看下这个事件的介绍 看介绍,这两个事件做的事情差不多,然后我在具体的介绍中发现了这个 第一点:.on()事件绑定的元素必须是页面…