JavaScript 事件绑定只能执行一次了,再次点击就变得无效 ,求助怎么回事

新手上路,请多包涵

点击收藏,弹出提示框,询问是否取消收藏,然后点击提示框里面的关闭按钮,关闭提示框后。再次点击那个触发事件的 收藏按钮就会无效 图片描述

图片描述

clipboard.png

var collectionBtn = document.querySelectorAll('.collection-center .collection-shouc');

var Ceng = "<div id='alert' class='alert'><div class='alert-k'><div class='alert-k-close'>×</div><a class='yes' href='javascript:;'>确定</a><a class='no'  href='javascript:;'>取消</a></div></div>";

for(var i = 0; i<collectionBtn.length; i++){
    collectionBtn[i].addEventListener('click',addEvent,false);
}

function addEvent(){
        if(document.querySelector('#alert')){
            shows();
        }else{
            document.body.innerHTML += Ceng;
            shows();
        }
    }

function shows(){
    var ale   = $('.alert');
    var ale_k =  ale.find('.alert-k');
    ale.show(500);
    ale_k.slideDown(200);
    hides();
    
}
function hides(){
    var ale = $('.alert');
    $('.alert-k').on('click', '.alert-k-close', function(){
        $(this).parent().slideUp(200);
        $(this).parent().parent().hide(500);
    });
}
阅读 8.9k
1 个回答
  1. 按钮确定取消效果反了. 确定就是确定操作, 取消就是单纯隐藏这个confirm的div

  2. 我猜你重新生成了一个按钮, 这样之前绑定的事件就和之前的按钮一起被销毁了
    解决方法:

             1> 绑定的时候用 $("document").on("click", ".某元素" , function(){});
             2> 或者只用这一个元素就可以了, 没有必要重新生成一个按钮
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题