Question

我正在添加一个带有用户选择的隐藏字段，以便稍后重新插入。此外，我正在添加一个普通的div，以向用户显示他们的选择。

我正在尝试创建一个删除功能，其中按钮将删除可见行以及隐藏行。

现在我可以删除正确的可见行，但不会删除正确的隐藏div。

我试图获取data-id，但它总是删除行中的最后一个，而不是相应的。

如何从#hiddenChildAgeRanges中删除与#visibleAgeRange中对应的正确div？

  //nanny childcare ranges
        $.each(data.nanny_age_range, function(index, data) {   

                var str = '<a href="#" id="' + data.nanny_age_range_id + '" aria-label="Close" class="deleteAge"><i class="fa fa-times" aria-hidden="true"></i></a>';

                var hiddenAgeTo = '<input id="userProfileAgeTo' + childAgeCount + '" value="'+data.age_maximum+'" name="userProfileAgeTo[]" style="visibility:hidden; position:absolute;" type="text" />';

                var hiddenAgeFrom = '<input id="userProfileAgeFrom' + childAgeCount + '" value="'+data.age_minimum+'" name="userProfileAgeFrom[]" style="visibility:hidden; position:absolute;" type="text" />';

                var childAgeAppend = 
                    '   <div class="col-md-12" id="childAgeRange'+childAgeCount+'">'+
                    '       <div class="col-md-3">'+
                    '       <b>From'+data.age_minimum+' to '+data.age_maximum+'</b>'+
                    '       </div>'+
                    '       <div class="col-md-3">'+
                    '       '+str+''+
                    '       </div>'+
                    '</div>';
                $("#hiddenChildAgeRanges").append('<div name="nanny_age_range_id[]" value="'+data.nanny_age_range_id+'" id="userAgeRangeSelection'+ childAgeCount+'" data-id="userAgeRangeSelection'+data.nanny_age_range_id+'">'+ hiddenAgeFrom + hiddenAgeTo+'');
                $("#visibleAgeRange").append(childAgeAppend);
                childAgeCount++;   

        });

//delete nanny age range
$(document).on("click", ".deleteAge", function(e) {
    e.preventDefault();
    var age_id = $(this).attr('id');

    $(this).closest('.col-md-12').fadeOut(300, function() {
        $(this).remove();
    });
    $.ajax({
        type: "POST",
        url: 'PHP/deleteData.php',
        data: "age_id=" + age_id,
        success: function(data) {
            if (data.status == 'success') {
                childAgeCount--;
            } else if (data.status == 'error') {
            }
        },
        error: function(jqXHR, textStatus, errorThrown, data) {
            console.log(jqXHR, textStatus, errorThrown, data);
        }
    });
});

Answer 1

使用nanny_age_range_id属性创建隐藏元素时，deleteAge元素也是remove()元素的ID属性。创建选择器并执行操作。

您可以使用Attribute Equals Selector [name=”value”]和//delete nanny age range $(document).on("click", ".deleteAge", function(e) { e.preventDefault(); var age_id = $(this).attr('id'); $('[data-id="userAgeRangeSelection' + age_id +'"]').remove(); //Rest of the code });。

cr.execute('select distinct(value) from ir_translation where name = \'product.bat3,name\' and src = \''+ str(res_bat[j][0].encode('utf-8'))+'\' and res_id = '+ str(res_bat[j][1])+' and lang = \''+ str(line2.partner_id.lang)+'\'')

如何删除带有data-id的ajax附加容器

1 个答案: