简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Heim
Artikel
Fragen und Antworten
Kurs
Thema
Herunterladen
Spiel
Wörterbuch
kürzliche Updates

Heim  >  Fragen und Antworten  >  Hauptteil

javascript - 绑定click事件append div,点击回复再移除。为什么点击“回复”按钮会增加下次append的div的个数？

var $html="<p id='reply1'>haha <button class='replyBtn'>回复</button></p>"
$(".reply").one("click",function(){

$(this).parent().parent().append($html);

});
$(".replyBtn").live("click",function(){

$("#reply1").remove();
$(".reply").one("click",function(){
    $(this).parent().parent().append($html);
});

});
要做的功能是点击.reply弹出回复框p，点击"回复"button关闭这个p。

问题：第一次点击.reply添加p是没有问题的;但是一旦点击了回复remove掉p后，下次再点击.reply却添加了两个p; 都关闭后再点击.reply，就添加了三个p....总之，就是点击过几次回复，下次点.reply就会出现几个p。。。。为什么呀？求助

天蓬老师天蓬老师2769 Tage vor410

Antworte allen(6)Ich werde antworten

  • 黄舟

    黄舟2017-04-11 11:28:43

    p 虽然被移除了，但他绑定的事件并没有被解绑，$(".replyBtn").unbind().live("click",function(){...
    现在jquery不建议用live了，所有一般这么写$(".replyBtn").off().on("click",function(){...

    Antwort
    0
  • 伊谢尔伦

    伊谢尔伦2017-04-11 11:28:43

    使用jquery处理事件，建议只采用on和off两个方法。

    Antwort
    0
  • 高洛峰

    高洛峰2017-04-11 11:28:43

    这个说明你没有删除对元素

    Antwort
    0
  • 巴扎黑

    巴扎黑2017-04-11 11:28:43

    建议用on和off。
    因为你没有给出结构，所以我猜问题出现在live上：
    改成这样试试：

    $(".replyBtn").die('click').live("click", function() { 
    $("#reply1").remove();
    $(".reply").one("click", function() {
        $(this).parent().parent().append($html);
    });
});

    Antwort
    0
  • ringa_lee

    ringa_lee2017-04-11 11:28:43

    原先绑定的事件没有被移除

    $("").off('click','.reply');
$("").on('click','.reply',function(){});

    Antwort
    0
  • 大家讲道理

    大家讲道理2017-04-11 11:28:43

    <!DOCTYPE html>
    <html>
    <head>

    <meta charset="UTF-8">
<title></title>

    </head>
    <body>
    <p class="reply">回复1</p>
    <p class="reply">回复2</p>
    <p class="reply">回复3</p>
    <p class="reply">回复4</p>
    <p class="reply">回复5</p>
    <p class="reply">回复6</p>
    <p class="reply">回复7</p>
    <p class="reply">回复8</p>
    </body>
    <script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>

    var $html = "<p id='reply1'>haha <button class='replyBtn'>回复</button></p>";
$(".reply").one("click", function() {
    $(this).parent().parent().append($html);
});
$(".replyBtn").live("click", function() {

    $("#reply1").remove();
    $(".reply").off("click").one("click",function(){
        $(this).parent().parent().append($html);
    });
});

    </script>
    </html>

    Antwort
    0
  • StornierenAntwort