Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/73.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
jquery删除作为克隆的父元素_Jquery - Fatal编程技术网

jquery删除作为克隆的父元素

jquery删除作为克隆的父元素,jquery,Jquery,我有以下html: <div class="row trackingRow"> <div class="large-2 medium-2 columns text-right no-margin"> <p>Customerwise</p> </div> <div class="large-3 medium-3 columns"> <input type="text

我有以下html:

<div class="row trackingRow">
    <div class="large-2 medium-2 columns text-right no-margin">
        <p>Customerwise</p>
    </div>
    <div class="large-3 medium-3 columns">
        <input type="text" class="radius" />
    </div>
    <div class="large-7 medium-7 columns">
        <a href="#" target="_blank" class="button tiny success radius">open ticket in new window</a>
        <a href="#" class="button tiny secondary radius deleteTracking"><img src="img/trash_icon.png" /></a>
        <a href="#" class="button tiny radius addAnother"><img src="img/tiny_plus_icon.png" /></a>
    </div>
</div>

定制

我目前正在使用jquery在单击“AddOther”链接时克隆整个“trackingRow”div,这样我的客户机就可以输入与票证关联的尽可能多的ID。他们还需要能够删除它们。我能够通过以下方式实现功能:

<script>

    $(".addAnother").click(function () {
        var cloneDiv = $(this).closest(".trackingRow").clone();
        cloneDiv.find("a.addAnother").remove();
        cloneDiv.insertAfter($(this).closest(".trackingRow"));
    });

    $(".trackingRow").on("click", ".deleteTracking", function () {
        $(this).closest(".trackingRow").remove();
    });

</script>

$(“.addother”)。单击(函数(){
var cloneDiv=$(this.closest(“.trackingRow”).clone();
cloneDiv.find(“a.addother”).remove();
cloneDiv.insertAfter($(this.closest(.trackingRow));
});
$(.trackingRow”)。在(“单击”,“删除跟踪”,函数(){
$(this).closest(“.trackingRow”).remove();
});

但是删除任何克隆的trackingRow都不起作用,只有原始的trackingRow。我缺少什么?

您正在使用委托事件处理:

$(".trackingRow").on("click", ".deleteTracking", function () {
    $(this).closest(".trackingRow").remove();
});
但是,您只将事件处理程序附加到原始元素(它不会附加到新创建的
trackingRow
克隆,因为它们在您安装事件处理程序时不存在)。您需要选择一个父对象,该对象是一个父对象,但它是静态的(不是动态创建的),以便将委托事件处理程序附加到它。由于您不显示HTML,我将显示
文档
对象作为静态父对象,但您可能会找到一个更靠近按钮的静态父对象,这会更好:

// best to pick a static parent as close to deleteTracking as possible
// document will work, but it's better practice to pick a closer parent that
// is not dynamically created itself
$(document).on("click", ".deleteTracking", function () {
    $(this).closest(".trackingRow").remove();
});

哇,我觉得自己很笨。这是一个显而易见的解决办法。一直盯着这个代码看太久了。:)谢谢