Question

我有input field，其中值等于id和button。当button被触发时，我想删除输入字段中的id也是value is equal所存储数据的按钮输入字段或id。这里http://jsfiddle.net/leonardeveloper/hcfzL/3/

HTML：

<form id="materialForm" action="#" method="post">
    <input id="materials" type="text" name="materials" value="1,2,3" readonly="readonly" disabled="disabled" />
</form>
<div id="display">
    <button class="removes" value="1">x</button>
    <button class="removes" value="2">x</button>
    <button class="removes" value="3">x</button>
</div>

JS：

$(document).on('click', '.removes', function () {
    var id = $(this).val();
    alert(id);
    $('#materials').remove(":contains('" + id + "')");
    $('#display').remove(":contains('" + id + "')");
    return false;
});

Answer 1

.remove()用于删除DOM元素，而不是从值中删除文本。它会删除它所应用的元素，而不是其中包含的元素。

$(document).on('click', '.removes', function () {
    var id = $(this).val();
    alert(id);
    var materials = $('#materials').val().split(',');
    materials = materials.filter(function(e) {
        return e != id;
    });
    $('#materials').val(materials.join(','));
    $(this).remove();
    return false;
});

FIDDLE

Answer 2

:contains选择器用于选择包含其他DOM节点的DOM节点。在您的情况下，您希望选择在其值中具有特定字符串的输入元素。

您应该使用.filter进行过滤以选择与过滤器匹配的输入元素。

Answer 3

尝试

$(document).on('click','.removes',function(){
    var id = $(this).val();
    $('#materials').val(function(){
        var value = this.value, array = value.split(',');
        var idx = $.inArray(id, array);
        if(idx >=0 ){
            array.splice(idx, 1)
            value = array.join(',')
        }
        return value;
    })
    $(this).remove();
    return false;
});

演示：Fiddle

.remove（“：contains（）”）不起作用

3 个答案: