JQuery中live方法的使用

最新推荐文章于 2018-12-17 21:24:24 发布

原创最新推荐文章于 2018-12-17 21:24:24 发布 · 235 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

JavaScript文章同时被 2 个专栏收录

19 篇文章

订阅专栏

JQuery文章

12 篇文章

订阅专栏

本文通过实例演示了JQuery中live方法的应用，该方法能够为当前及未来动态添加的元素绑定事件处理函数，确保新增元素也能响应指定的事件。

JQuery中live方法是给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效

下面简单测试了JQuery中live方法的使用，仅供参考

HTML代码

<div id="testDiv">
    	<input type="button" value="添加" class="testBtn" />
    </div>

JS代码：

$('.testBtn').click(function()
	{
		var html = '<div id="appDiv">appDiv</div>';
		
		$('#appDiv').live('mouseover mouseout', function(e)
		{
			if(e.type == 'mouseover')
			{
				$('#appDiv').css('background', 'red');
			}
			else if(e.type == 'mouseout')
			{
				$('#appDiv').css('background', 'green');
			}
		});
		
		$('#testDiv').append(html);
	});