如何统计含特定文本的input标签数量？如何筛选指定值input并检测重复输入

嘿，这个需求我太熟了！咱们直接来拆解解决：

首先要明确：jQuery的:contains()是用来匹配元素内部文本内容的（比如<div>abc</div>），但input的内容存在value属性里，不是元素的文本节点，所以对input完全无效。咱们得用更适合的方法：

1. 最灵活的方法：用.filter()筛选指定值的Input #

这是我最推荐的方案，逻辑清晰还能处理复杂判断（比如去掉空格、忽略大小写之类的）。比如你要筛选值为abc的input，代码可以这么写：

// 筛选出name为employerId且值为abc的文本输入框
var matchingInputs = $('input:text[name="employerId"]').filter(function() {
  // 这里可以加trim()避免空格导致的误判
  return $(this).val().trim() === 'abc';
});

2. 结合Change/Input事件实现重复标记 #

你提到用change()事件检测重复，咱们把筛选逻辑整合进去，实现实时标记重复的功能：

// 监听目标input的输入事件（用input比change更实时，输入过程中就能检测）
$('input:text[name="employerId"]').on('input', function() {
  var currentVal = $(this).val().trim();
  var allTargets = $('input:text[name="employerId"]');

  // 先清除之前的重复标记
  allTargets.removeClass('duplicate');

  // 只有当前输入不为空时才检测
  if (currentVal) {
    // 筛选出所有值相同的input
    var duplicates = allTargets.filter(function() {
      return $(this).val().trim() === currentVal;
    });

    // 如果重复数量大于1，给它们加标记类
    if (duplicates.length > 1) {
      duplicates.addClass('duplicate');
    }
  }
});

再配合CSS样式让标记更明显：

.duplicate {
  border-color: #ff4444;
  background-color: #ffebee;
}

3. 可选：封装自定义选择器（类似:contains） #

如果你想像:contains一样直接用选择器语法，也可以注册一个自定义的:val()选择器，方便复用：

// 注册自定义选择器
$.expr[':'].val = function(element, index, match) {
  return $(element).val() === match[3];
};

// 用法示例：筛选值为abc的目标input
var matchingInputs = $('input:text[name="employerId"]:val("abc")');

不过要注意：自定义选择器在处理大量input时，性能会比.filter()稍差一点，所以优先推荐第一种方案。

内容的提问来源于stack exchange，提问作者Craig