javascript - 关于动态加载后再绑定事件,事件不起作用的提问
淡淡烟草味
淡淡烟草味 2017-07-05 11:05:56
0
5
1068

我在ajax动态创建了三个p盒子之后,再给盒子绑定点击事件为什么不起作用?只有在ajax创建的时候 同时给他 绑定事件才有用?这样就绑定了三遍,这是为什么呢?有没有更优的办法?

淡淡烟草味
淡淡烟草味

全部回复(5)
阿神

比如你可以看看jquery实现

$("#a").click(callback);
$(document).on('click','#a',function(){ //TODO });
$("#a").live();//过时
Ty80

$(document).on('click','#a',function(){ //TODO }); 借一楼回答的 感觉可以 先找到他父元素再绑定

仅有的幸福

这个我以前碰过,动态加载的DOM用onclick是不起作用的,因为只对存在的dom起作用,用$(document).on('click','#a',function(){})才行,你可以试试看。

phpcn_u1582

你可以用事件委托来实现,就比如说

<p class="wrapper">

</p>

你想在wrapper里面添加一个列表(.list),委托你可以这样写(简单写法):

//获取目标节点(这里只支持class获取)
//ele: 起始元素,最内侧的元素
//selector: className,
//stopTrget: 委托容器元素
function getTargetNode(ele,selector,stopTarget){
    var clsReg = new RegExp(selector),
        className = ele.className;
        
    if(ele === stopTarget) return null;
        
    if(clsReg.test(className)){
        return ele;
    } else {
        return getTargetNode(ele.parentNode,selector);
    }
};

//委托
function addEvent(event,ele,selector){
    ele["on"+event] = function(e){
        e = e || event;
        var target = e.target || e.srcElement;
        //当满足触发条件时
        if(getTargetNode(target,selector,ele)){
            //The deep♂dark♂fantasy
        }
    };
}

addEvent("click",document.querySelecor('.wrapper'),'.list');
过去多啦不再A梦

用JQ的on方法和delegate方法都可以,原生的话用事件委托

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板