html页面js新加html元素js事件无效

2018-08-10  本文已影响0人  eng_0cc9
如图,在有写点击事件的时候写在html页面里的元素点击有效果 如图,加载更多后,加载出来的元素点击没有效果 html

原先js代码

$(" .trading-terminal .item-sel ").click(function(){

    var $ul = $(this).parent("li").find(".item-center").css("display");

    $(this).parent("li").toggleClass("show");

    $('.Position').find('li').removeClass("show");

    if($ul=="none"){ 

    $(this).parent("li").addClass("show");

    }else{

        $(this).parent("li").removeClass("show"); 

    }

});

解决办法:

可以用 jQuery 事件 - delegate() 方法;


定义和用法

delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。

使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

语法

$(selector).delegate(childSelector,event,data,function)

参数描述

如何使用 delegate() 方法向尚未创建的元素添加事件处理程序

自己的实例:代码

$("body").delegate('.trading-terminal .item-sel',"click",function(){

    var $ul = $(this).parent("li").find(".item-center").css("display");

    $(this).parent("li").toggleClass("show");

    $('.Position').find('li').removeClass("show");

    if($ul=="none"){ 

    $(this).parent("li").addClass("show");

    }else{

        $(this).parent("li").removeClass("show"); 

    }

});

上一篇 下一篇

猜你喜欢

热点阅读