Question

我的目标是标记用户何时将相同的文本输入到与至少一个其他输入文本匹配的输入中。要选择所有相关输入，我有这个选择器：

$('input:text[name="employerId"]')

但我如何只选择那些文字= abc的人呢？

这是我的change()事件，用于检查页面上所有输入中的重复文本。我想我正在寻找像:contains这样的东西，但是对于输入中的文本。

var inputsToMonitorSelector = "input[type='text'][name='employerId']";
$(inputsToMonitorSelector).change(function() {
    //console.log($(this).val());
    var inputsToExamineSelector = inputsToMonitorSelector 
        + ":contains('" + $(this).val() + "')";
    console.log(inputsToExamineSelector);

    if($(inputsToExamineSelector).length > 1) {
        alert('dupe!');
    }
});

或者没有这样的选择器？我必须以某种方式选择所有inputsToMonitorSelector，并在函数中检查每个文本，递增一些局部变量，直到它大于1？

Answer 1

输入后，您需要使用[value="abc"]或.filter()

＆＃13;

$(document).ready(function() {
var textInputSelector = 'input[type="text"][name="employerId"]';
  $(textInputSelector).on('input', function() {
    $(textInputSelector).css('background-color', '#fff');
    var input = $(this).val();
    var inputsWithInputValue = $(textInputSelector).filter(function() {
      return this.value && input && this.value == input;
    });
    var foundDupe = $(inputsWithInputValue).length > 1;
    if(foundDupe) {
      console.log("Dupe found: " + input);
      $(inputsWithInputValue).css('background-color', '#FFD4AA');
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" name="employerId" value="abc">
<input type="text" name="employerId" value="">
<input type="text" name="employerId" value="">
<input type="text" name="employerId" value="">

＆＃13;

[value="abc"]表示值是abc
[value*="abc"] *表示该值包含abc
[value^="abc"] ^表示该值是否以abc
[value$="abc"] $表示该值是否以abc

注意： :contains()不是输入，而文字不用于输入和<select> ..输入和<select>有一个值

在您的情况下..而不是使用

$(inputsToExamineSelector).length > 1)

您可能需要使用.filter()

$(inputsToExamineSelector).filter('[value*="abc"]').length > 1)

或

$('input[type="text"][name="employerId"]').filter(function(){ return this.value.indexOf('abc') > -1 // for exact value use >> return this.value == 'abc' }).length;

要在其上使用变量，您可以像
一样使用它
'[value*="'+ valueHere +'"]'

Answer 2

这样的事情有效。将isDuplicated(myInputs,this.value)附加到附加到每个输入的keyup事件侦听器。

var myInputs = document.querySelectorAll("input[type='text']");

function isDuplicated(elements,str){
  for (var i = 0; i < myInputs.length; i++) {
    if(myInputs[i].value === str){
      myInputs[i].setCustomValidity('Duplicate'); //set flag on input
    } else {
      myInputs[i].setCustomValidity(''); //remove flag
    }
  }
}

Answer 3

这是另一个。我开始使用vanilla js，然后使用document.querySelector（x）来寻找像Ron Royston这样的答案，但最终得到了jquery。几件事的第一次尝试，但是你去了：

$("input[type='text']").each(function(){
    // add a change event to each text-element.
    $(this).change(function() {
        // on change, get the current value.
        var currVal = $(this).val();
        // loop all text-element-siblings and compare values.
        $(this).siblings("input[type='text']").each(function() {
            if( currVal.localeCompare( $(this).val() ) == 0 ) {
                console.log("Match!");
            }
            else {
                console.log("No match.");
            }
        });
    });
});

https://jsfiddle.net/xxx8we6s/

如何获取包含特定文本的输入标签数量？

3 个答案: