Question

您好，

HTML代码

<button class="view btn" data-toggle="collapse" data-target=".collapse">View Content</button>
<div class=" collapse">
    <div class="main-content">
        <p>Hello World</p>
        <button class="close btn">Close</button>
    </div>
</div>
<button type="rest" class="repeat btn col-md-12">Repeat</button>

Jquery代码：

    $(".main-content .close").click(function () {
          $(this).parents(".collapse").removeClass("in");
     });
    $(".repeat.btn").click(function (e) {

         e.preventDefault(); // to prevent form submit
         var $self = $(this);
         $self.before($self.prev('.collapse.in').clone());

    });

我的想法的步骤是：

1 - 使用Bootstrap framework

折叠div

2 - 重复此div - 点击重复按钮

3 - 用户可以在重复

之前和之后关闭一个div

第三个是我的问题......当我在重复内容之前点击关闭按钮时它起作用.....但是在重复之后没有＆＃39;

请帮助

请询问是否有任何事情不清楚。

Demo

Answer 1

事件委托允许我们将单个事件侦听器附加到父元素，该元素将为匹配选择器的所有后代触发，无论这些后代现在是存在还是将来添加。

$(document).on("click", ".close", function () {
    $(this).parents(".collapse").removeClass("in");

});
$(".repeat.btn").click(function (e) {

    e.preventDefault(); // to prevent form submit
    var $self = $(this);
    $self.before($self.prev('.collapse.in').clone());

});

它与Event delegation有关。祝你好运。

<强> SEE UPDATED FIDDLE

jQuery - 点击后关闭一个div并保持其他人使用

1 个答案: