Question

我有多个输入元素，我试图通过匹配值来比较另一个输入。

我遇到的问题是我无法将值与用户输入匹配，但是如果我尝试比较的输入在页面加载后已经有值，则它可以正常工作。

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<input type="text" class="list" value="1">
<input type="text" class="list" value="2">
<input type="text" class="list" value="3">
<br><br>
<input type="text" id="a" class="find" value="">
<input type="text" id="b" class="find" value="">

<button id="trigger">Click Me</button>

<script>
$(document).on('click', '#trigger', function () {
    $('.list').each(function () {
        var value = $(this).val();
        var match = $('input.find[value="'+value+'"]').attr('id');
        alert(match);
    });
});
</script>

修改

我想我应该指出我循环浏览第一组输入值并检查多个用户输入，这样我就可以检索匹配用户输入的id。更新了我的代码和小提琴

Answer 1

编辑：看起来您正在寻找比原始解决方案更灵活的解决方案。

我使用jQuery#each实现了它。

＆＃13;

$('#trigger').click(function() {
  $('.list').each(function() {
    var value = this.value, match
    $('.find').each(function () {
      if (this.value === value) {
        // found a match!
        match = this.id
        return false
      }
    })
    console.log('value:', value, 'match:', match)
  })
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="list" value="1">
<input type="text" class="list" value="2">
<input type="text" class="list" value="3">
<br><br>
<input type="text" id="a" class="find" value="">
<input type="text" id="b" class="find" value="">
<button id="trigger">Click Me</button>

＆＃13;

Answer 2

对每个输入运行并按值进行比较

    $('#trigger').click(function () {
      var a = $('#a').val();
      $('input.find').each(function(){
      	if (this.value === a )
        	alert(this.id);
      });
    });

 


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <input type="text" id="a" value="13.4">
    <input type="text" id="b" class="find" value="13.4">
    <input type="text" id="c" class="find" value="13.2">
    <input type="text" id="d" class="find" value="13.4">
    <button id="trigger">Click Me</button>

fiddle

编辑：我认为你想要与班级find的多个输入进行比较

Answer 3

您可以尝试以下内容：

$(function(){
    $('#trigger').click(function () {
        var a = $('#a').val();
        var b = $(".find");
        if(a === b.val()){
            console.log('match found with id:'+b.attr('id'));
        } else {
            console.log('not any match found');
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="a" value="13.4">
<input type="text" id="b" class="find" value="">
<button id="trigger">Click Me</button>

Answer 4

如果您只想比较值使用相等（==），请使用identity（===）以便比较值以及类型如string，int等。

$('#trigger').click(function () {
  var a = $('#a').val();
  var b = $('#b').val();
  if(a==b)
  alert("matched");
  else
  alert("not matched");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="text" id="a" value="13.4">
<input type="text" id="b" class="find" value="">
<button id="trigger">Click Me</button>

Answer 5

像这样使用jQuery.filter：

＆＃13;

$('#trigger').click(function() {
  var val = $('#a').val();           // get the value of #a input
  var inputs = $("input.find");      // get all the other inputs (the ones that have the class find)

  inputs.removeClass("green");
  if (val.length) {                  // if the value of #a is not empty
    inputs.filter(function() {       // filter out all the inputs that have the same value
      return $(this).val() === val;
    })
    .addClass("green")
    /*
    .each(function() {
      alert(this.id);
    });
    */
  }
});

＆＃13;

.green {
  background: lightgreen;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="a" value="13.4">
<input type="text" id="b" class="find" value="">
<input type="text" id="c" class="find" value="">
<input type="text" id="d" class="find" value="">
<button id="trigger">Click Me</button>

＆＃13;

Answer 6

试试这个 -

$('#trigger').click(function () {

    var a = $('#a').val();
    var match = $('input[value="'+a+'"]').attr('id');
    alert(match);
});

用户输入后按值获取元素

6 个答案: