Question

如果在“Orange”之前添加“Orange”，即readonly。具有红色边线的input是只读的input w / c是错误的。我不想要read-only input（据说从数据库中标记为重复或有红色边线）

当前输出：

Apple [read-only]
Orange // *added by user*
Orange[read-only] //borderline changed to red when button save is clicked

通缉输出：

Apple [read-only]
Orange // *added by user* and borderline changed to red when button save is clicked
Orange[read-only]

请参阅此FIDDLE for demo，然后尝试点击“橙色”值输入字段前面的添加行按钮，并输入另一个“橙色”值。

$("#save").off("click").on("click",function(){
    var existing = [];
    var duplicates = $('#myTable td:nth-child(3) input').filter(function() {
        var value = $(this).val();
        if (existing.indexOf(value) >= 0) {
            return $(this);
        }
        existing.push(value);
    });
    duplicates.closest('tr').css('background-color', 'red');
});

我试过了：

duplicates.closest('#myTable td:nth-child(3) input:not(readOnlyText)').css('background-color', 'red');

但没有任何改变。

Answer 1

这必然会按照您的代码进行。您需要区分用户添加的行与现有行。您可以将readonly属性用于用户添加的行，然后应用您的过滤器。

$("#save").off("click").on("click",function(){
    var existing = [];
    $('#myTable td:nth-child(3) input').filter(function() {
        var value = $(this).val();
        if ($(this).attr('readonly')) {
            existing.push(value);
         }
    });
    var duplicates = $('#myTable td:nth-child(3) input').filter(function() {
        var value = $(this).val();
        if (existing.indexOf(value) > -1 && !$(this).attr('readonly')) {
            return $(this);
        }
    });
    duplicates.closest('tr').css('background-color', 'red');
});

禁用使用给定类更改border-color

1 个答案: