JQuery遍历指定name属性HTML元素并对比值的技术问题

先说说你最初报错的原因 #

你看到的Uncaught Error: Syntax error, unrecognized expression: [name=[object HTMLInputElement]]错误，核心问题是选择器语法不合法：

• 要么是调用checkValue时，传入的name参数不是字符串，而是一个DOM元素对象（比如直接传了input元素），拼到选择器里就变成了[name=[object HTMLInputElement]]，完全不符合CSS选择器规则；
• 要么是选择器里的属性值没加引号，jQuery无法正确解析属性值。

你后来给选择器加了单引号，解决了语法错误，但又遇到了只检查第一个元素的问题——这是jQuery的.val()方法的特性：当匹配多个元素时，它只会返回第一个元素的value值，自然没法遍历所有元素做判断。

正确的写法：遍历所有匹配元素并逐个检查 #

要实现遍历所有具有指定name属性的元素，并且每个元素都和目标值对比，得用.each()方法逐个处理，代码如下：

function checkValue(name, value) {
  // 用单引号包裹name属性值，确保选择器语法合法
  $("[name='" + name + "']").each(function() {
    // $(this)指代当前正在遍历的元素
    if ($(this).val() === value) {
      console.log(`找到匹配值 ${value} 的元素`);
      // 这里可以添加匹配后的操作，比如高亮元素、触发事件等
    }
  });
}

额外的优化建议 #

1. 处理特殊字符的情况：如果你的name属性值可能包含空格、引号、方括号这类特殊字符，建议用$.escapeSelector()转义，避免选择器失效：

   $("[name='" + $.escapeSelector(name) + "']").each(function() {
     // 逻辑不变
   });
   

2. 严格相等判断：用===代替==，避免因为类型转换导致的意外匹配（比如字符串"123"和数字123会被==判定为相等，但===不会）。
3. 确认参数类型：调用函数时，确保name是字符串类型，不要传DOM元素对象进去，这是最初报错的核心原因之一。

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