`

使用jQuery动态绑定事件插件livequery弥补live的不足

阅读更多
jquery1.3.2的动态绑定事件方法live不支持blur,focus,mouseenter,mouseleave,change,submit,特别是不支持blur,focus事件使我很不爽(因为我的页面需要这个功能,:)。
后来发现livequery这个插件,发现它支持blur,focus,并且还支持自定义方法,很强!于是替代了jquery自带的live,完美!
注意,新出来的jQuery1.4不用livequery这个插件也可以实现了!

I've successfully used livequery plugin as a complement to .live() function in jQuery. Not only can it bind events like focus,blur and change (that live() does not support yet, as of 1.3.2) but also it provides you with a mechanism to bind custom events to DOM elements on the fly. For example, I used it to bind draggable and droppables to some DOM elements which will be added through Ajax. It makes my code much simpler to read and easier to maintain.

//我要动态修改span中的文字
function formatUserName(value, pid){
		var span="<span class='spanModify' style='color:red' id='"+pid+"'>"+value+"</span>";
		return span;
	}
//双击span变成一个文本输入框
	$('.spanModify').live('dblclick',function(){//使用jquery自带的live动态绑定dblclick
		var id=$(this).attr('id');
		var value=$(this).text();
		var input=$("<input class='inputBlur'  type='text'>").attr({'value':value,'id':id});
		$(this).replaceWith(input);
		input.focus();
		return;
	});
//文本输入框失去焦点时变回span
	$('.inputBlur').livequery('blur',function(){//动态绑定blur,需要livequery插件
		var id=$(this).attr('id');
		var value=$(this).val();
		var span=$("<span class='spanModify' style='color:red'></span").attr({'id':id}).text(value);
		$(this).replaceWith(span);
		return;
	});

很简单实现了
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics