追加元素问题

时间:2011-09-05 11:07:52

标签: javascript jquery

我正在创建一些元素并附加它,并且它工作正常,但是当我想调用任何函数或者想要调用任何不起作用的jquery时,但是当我直接放置那些元素而不是附加时它可以正常工作。总而言之,追加元素不会调用任何函数或任何东西。

JQUERY CODE:

var cart_content = jQuery($.create('li', {}, [])).append($.create('span',{}, [av_title]),$.create('img', {"src":"images/delete_icon.png", "class":"cart_content", "alt":"delete", "title":"Delete"}, []));
$(".advertise_cart").append(cart_content);


$(".cart_content").click(function(){    alert("Hello"); });
<ul class="advertise_cart" id="advertise_cart_id">
   <li>
        <span>Inner Content 1</span>
        <img src="images/delete_icon.png" class="cart_content" alt="delete" title="Delete">    <!------ On clicking on this will show alert box, but on clicking on appended element will not call alert box or anything ----->
    </li>
</ul>

提前致谢

4 个答案:

答案 0 :(得分:1)

请勿使用.click功能。

使用实时功能,它适用于DOM中新添加的元素

像这样:

$(".cart_content").live(function(){    alert("Hello"); });

答案 1 :(得分:1)

您遇到的问题是绑定事件时元素不存在于DOM中的结果。要解决此问题,您可以使用delegate()live()

$('body').delegate('.cart_content','click',
    function(){
        alert('hello');
    });

JS Fiddle demo

参考文献:

答案 2 :(得分:0)

使用live功能处理您的活动可能会有所帮助。

答案 3 :(得分:0)

我唯一要补充的是,live函数意味着处理程序将继续应用于将来任何时候与选择器匹配的内容(除非你调用unbind,否则)。这可能就是你想要的。如果不是,你可以编写可以在短暂延迟(比如1.5秒)后添加点击处理程序。或者更确切地说,您可以编写代码,每隔100毫秒检查一次.cart_content是否存在,直到找到它为止,然后添加单击处理程序。所以这种方法只会添加一次点击处理程序。如果稍后添加了另一个.cart_content,则不会自动添加点击处理程序。