jQuery Attribute Equals Selector [name =“value”]发出传递以反斜杠结尾的变量

时间:2015-05-01 19:02:45

标签: javascript jquery escaping custom-data-attribute backslash

幽默我这个。

在我的代码中,我试图找到与数据属性值匹配的所有div。现在这个值是由用户创建的,因此字符串可以包含任何内容。

在我测试期间,当值包含引号并以反斜杠“\”(javascript转义字符)结束时,我遇到了错误。

  

错误:语法错误,无法识别的表达式:   的className [数据的AttributeName = “MAC” 的Mac \“]

以下是一个示例(请注意,在此示例中,双反斜杠会自行转义,第一个反斜杠会转义引号):

var value= "Mac\"Mac\\";
$('.className[data-attributename="'+value+'"]');

如果字符串包含引号(“)且字符串末尾有反斜杠(\),则只会发生此错误。如果反斜杠后面有空格或者反斜杠位于字符串的开头或中间没有问题。

是否可以传递包含引号或撇号(“')并以反斜杠(\)结尾的变量到jQuery Attribute Equals Selector

一个明显的解决方案就是阻止我的用户使用反斜杠“\”字符。如果我这样做,那么使用这个jQuery选择器还有其他任何可能有害的角色吗?

另一种解决方案是:

var value= "Mac\"Mac\\";
$('.className').each(function(){
    if($(this).attr('data-attributename') === value){
      //perform action
    }
});

使用此解决方案会降低效率,因为它必须遍历每个元素或者属性等于选择器基本上以相同的方式工作吗?如果是这样,为安全起见,我应该总是在属性equals selector上使用此解决方案吗?

以下是我将尝试选择的div的示例:

$('body').append("<div class='className' data-attributename='Mac\"Mac\\' ></div>")

2 个答案:

答案 0 :(得分:1)

您将不得不使用第二个解决方案来使jQuery正常工作。 有人提出类似的问题,这是对其中一个问题的答案。 jQuery selector value escaping

  

$("#SomeDropdown >option[value='a\\'b]<p>']")

     

但这不起作用   jQuery因为它的选择器解析器并不完全   符合标准的。它使用此正则表达式来解析value部分   [attr=value]条件:

     

(['"]*)(.*?)\3|)\s*\]

     

\ 3是包含开头的组   引号,奇怪地允许多个开头报价,或者不   打开报价。 。*?然后可以解析任何角色,包括   引号直到它击中第一个']'字符,结束比赛。那里   没有提供反斜杠转义的CSS特殊字符,所以你   无法匹配jQuery中的任意字符串值。

答案 1 :(得分:0)

您可以使用escape()函数来转义特殊字符,如

value = escape('Max\\'); //it will return Max%5C