欢迎访问

云南鼎浩信息技术有限公司官方网站,云南网站建设诚信品牌!

鼎浩网络,云南鼎浩信息技术有限公司

鼎浩客服热线

DING HAO COLUMN 鼎浩专栏

鼎浩的一些分享
Sharing from Ding Hao

  • 鼎浩服务
  • 1

使用livequery插件对动态创建的DOM元素进行事件绑定

来源:     2013年07月02日17:02
字号:T|T

Livequery是一款基于jQuery的插件,主要作用是对动态创建的DOM元素进行事件绑定。比如我在页面中动态创建了一个新的按钮,需要通过单击新的按钮来完成某些操作,这个时候就可以用到livequery。

查看演示DEMO 下载源码

先来看以个不适用livequery的例子。


通过单击页面上的按钮创建一个新的按钮,这时再去单击新按钮时却没有任何反应,但是我已经在新的按钮上通过bind方法绑定了一个click事件,原因是bind函数执行时,这些新的按钮还没创建,所以不可能绑上事件。这时需要借助livequery来完成绑定,直接将上述代码中的bind改成livequery,当然先要加载livequery插件。

其实到这里还没发现livequery有多强大,jQuery本身的live方法已经基本能实现了上述功能。

$(".newdiv").live('click',function(){
	alert('绑定了单击事件');
});

关键是livequery不光只是绑定事件,它还能做很多事。

接下来看一个支持jQuery UI的draggable函数的例子:

在页面上放置一个按钮。


执行操作:

$("#drag").click(function(){
	$("
新增了一个可以拖动的DIV
").insertAfter($(this)); }); $(".dragdiv").livequery(function(){ $(this).draggable(); });

借助livequery和jQuery UI,可以在页面上动态创建N个可以拖动的DIV。此外完成此例必须导入jQuery UI库。

客服中心
点击进行在线咨询

QQ咨询 咨询QQ:79929313 咨询QQ:88139574 咨询QQ:122790803

咨询热线:0871-63399840

客服热线:0871-63523332

客服中心 客服中心