从JSON配置获取jQuery选择器时出现语法错误的排查与解决

问题重现 #

你定义了包含选择器的配置对象：

var config = [
  {"fieldname": "First name","selector":"\"[id$='txtFirstName']\"","value": "Bob"},
  {"fieldname": "Last name","selector": "\"[id$='txtLastName']\"","value": "Smith"}
];

遍历赋值的代码：

$(config).each(function() {
  console.log('selector:')
  console.log(this.selector);
  var element = $(this.selector);
  element.val(this.value);
})

运行后控制台输出异常的选择器字符串：

"selector:"
"\"[id$='txtFirstName']\""

并触发语法错误：

Error: Syntax error, unrecognized expression:
\"[id$='txtFirstName']\"

原因分析 #

问题出在config里的selector字段被额外添加了不必要的双引号转义。你原本需要的合法选择器是[id$='txtFirstName']，但却给它套了一层转义双引号（"\"xxx\""），导致实际读取到的selector值是带转义标记的双引号包裹的字符串。当jQuery尝试解析这个字符串作为选择器时，这些多余的转义双引号会被视为选择器的一部分，而jQuery的属性选择器并不需要外层的双引号，因此直接触发了语法错误。

解决方法 #

方法1：修改原始配置（推荐） #

直接去掉selector字段中外层的转义双引号，让选择器本身保持合法格式：

var config = [
  {"fieldname": "First name","selector":"[id$='txtFirstName']","value": "Bob"},
  {"fieldname": "Last name","selector": "[id$='txtLastName']","value": "Smith"}
];

这样遍历代码无需修改，就能正常找到目标元素并赋值。

方法2：在代码中清理选择器字符串 #

如果无法修改原始config的定义，可以在遍历过程中去除字符串两端的转义双引号：

$(config).each(function() {
  // 移除字符串首尾的转义字符和双引号
  var cleanSelector = this.selector.replace(/^["\\]+|["\\]+$/g, '');
  var element = $(cleanSelector);
  element.val(this.value);
})

这段正则会匹配并删除字符串开头和结尾的所有双引号（"）和反斜杠（\），还原出原本合法的选择器。

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