需要转义jquery选择器字符串中的特殊字符

如果您希望使用任何类型的值,请尝试以下操作:

var val = $(this).attr('val').replace(/[!"#$%&'()*+,.\/:;<=>?@[\\\]^`{|}~]/g, "\\\\$&")

这是通过转义 Selectors page of the jQuery documentation 用两个反斜杠。

记住,在你的情况下,没有必要做这样棘手的事情。你可以使用 filter 函数选择具有给定值的所有选项元素,而不必转义该值,如Mathias Bynens的答案中所述。

CSS字符转义序列(在选择器中使用)是 tricky . 它们很棘手,我甚至做了 a web app that can tell you how to escape any character in CSS .

它简单得多 和 更高效的简单选择 option 元素,然后 filter 基于他们的 value 属性值:

var value = this.value;
$select.find('option').filter(function() {
  return this.value == value;
}).show();

这样,就根本不需要特殊的逃跑。

看看这个……

var val = $(this).attr('val').replace(/(\[|\])/g, '\\\\$1'); // something\\[4\\]\\[2\\]

当然,这只处理方括号,而不处理任何其他特殊字符。但是,根据我的经验,括号是我唯一使用的(因为PHP处理输入名称属性的简便方法如下: something[] )

jQuery's FAQ 有一个很好的解决方案,可以转义jquery所需的所有字符。

我喜欢这个nullsafe版本的建议:

function jqid (id) {
  return (!id) ? null : '#' + id.replace(/(:|\.|\[|\]|,|=|@)/g, '\\$1');
}

回答晚了,但是,

jQuery 3

并添加缺少的 "" 在里面 'option[value="'+ val +'"]'

var val = "something[4][2]";

$("select").find('option[value="' +  val  + '"]').show();

option{
  display: none;
}

<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

<select>
  <option value="something[4][2]">4,2</option>
  <option value="something[1][1]">1,1</option>
</select>

JQuery 3与 jQuery.escapeSelector()

不包含引号-因此使用原始选择器 'option[value='+ val +']'

var val = "something[4][2]";           
var eSel = $.escapeSelector( val );    // something\[4\]\[2\]

$("select").find('option[value='+ eSel +']').show();

选项{选项}
显示:无;
}

<script src=“https://code.jquery.com/jquery-3.1.0.js”></script>

选择& gt;
<option value=“something[4][2]”>4,2</option>
<option value=“something[1][1]”>1,1</option>
&选择/gt;

在选择器中的属性值周围加引号,然后您只需转义值中的反斜杠和引号:

var val = $(this).attr('val');

val = val.replace(/\\/g, "\\\\").replace(/"/g, '\\"');

$select.find('option[value="' +  val + '"]').show();

如果您知道该值没有任何反斜杠或引号(如在您的示例中),那么您不需要转义该值中的任何内容,只需要选择器中的引号。

如果选择器以特殊字符结尾,则不能使用双反斜杠对其进行转义。返回的工作是使用regex:例如,如果选择器ID为“bonus+”,则可以使用:

$("div[id$='bonus+']")

当您有动态选择器时,它就更有意义了。