在其他输入字段中查找输入值

时间:2018-10-30 21:25:19

标签: javascript jquery

我需要检查并找到是否在页面上的其他输入字段中找到了当前输入字段的值。

$(document).on("keyup", "input.card-label", function(){

    var ths = $(this),
    par = ths.closest(".inputContainer"),
    val = ths.val();

    if (ths.closest(".allInput").find("input.card-label").val() != val) {
        par.removeClass("dupe");
    } else {
        par.addClass("dupe");
        fle.prop("disabled", true);
    }
});

我似乎取得了部分成功。当我编辑重复值时,将删除“ dupe”类,但是当我有意输入重复值时,将不添加“ dupe”类。我想念什么?

1 个答案:

答案 0 :(得分:0)

如果我理解正确,那么您希望在输入的值与另一个输入的值相同时添加一个类。以下代码将keyup事件添加到任何输入,然后遍历所有其他输入以确定当前输入的值是否重复,在这种情况下,它将添加CSS类。

为了简单起见,我只使用了input选择器。您应该能够根据自己的需要进行调整。

$(function () {
  $('input').on('keyup', function (e) {
    // reference to this input
    var input = $(e.currentTarget)
    // get all inputs which are not this input
    var allInputs = $('input').not(this) 
    
    // loop through all other inputs
    for (var i = 0; i < allInputs.length; ++i) {
      // if another input's value is the same as this, add the class
      if ($(allInputs[i]).val() == input.val()) {
        input.addClass('dup')
      } else { // otherwise remove it (if it exists)
        input.removeClass('dup')
      }
    }
  })
})
.dup {
  border-color: red
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" />
<input type="text" />