如何转义“:”字符？

Question

例如，我有像这样的id：

someform:somepanel:somebutton

当我使用 jQuery("#someform:somepanel:somebutton") 时，它会返回 someform ，如何自动转义该ID？ 编辑： 我想做这样的事情：

jQuery(somefunction("#someform:somepanel:somebutton"))

- IAdapter

---

选择器分类页面的第三行描述了jQuery选择器的作用，即根据CSS选择器来查找和操作HTML元素。 - jAndy

@jAndy，那里没有，请您引用答案好吗？ - IAdapter

Answer 1

如果只是这个非常特殊的版本，你可以使用.replace()函数来替换字符。

function somefunction(selector) {
    return selector.replace(/:/, '\\\\:');
}

jQuery(somefunction("#someform:somepanel:somebutton"))

然后被转换为

jQuery("#someform\\:somepanel\\:somebutton");

要得到更通用的版本，可以使用正则表达式：

function somefunction(selector) {
    return selector.replace(/(!|"|#|\$|%|\'|\(|\)|\*|\+|\,|\.|\/|\:|\;|\?|@)/g, function($1, $2) {
        return "\\\\" + $2;
    });
}

- jAndy

---

我发现函数参数很令人困惑。https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Specifying_a_function_as_a_parameter 提供了一个很好的解释。 - elewinso

Answer 2

请使用双反斜杠：

 jQuery("#someform\\:somepanel\\:somebutton")

相关内容：

• jQuery选择器值转义
• 何时需要转义元字符？（jQuery选择器）

• http://api.jquery.com/category/selectors/

  • 如果您希望使用任何元字符（例如!"#$%&'()*+,./:;?@[\]^{|}~）作为名称的字面部分，则必须使用两个反斜杠进行转义：\\。例如，如果您有一个具有id =“foo.bar”的元素，则可以使用选择器 $（“# foo \\.bar”）。 W3C CSS规范包含有关有效CSS选择器的完整规则集。

---

更新 #1

在您对自动转义的评论之后，我认为最好的方法是在字符串对象内创建一个函数，如下所示

String.prototype.escape = function()
{
    return this.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/])/g,'\\$1')
}

你也可以像这样专门为冒号定义一个函数:

String.prototype.escape_colon = function()
{
     return this.replace(/:/,'\\$1')
}

并且这样使用：

jQuery("someform:somepanel:somebutton".escape())

但是这将会导致伪选择器出现问题，比如：

jQuery("someform:somepanel:somebutton:first".escape())

:first选择器将被转义，因此您将找不到您的元素。

但是，最好的方法是在原型中构建一个字符串解析器，以替换它发现特定字符集的位置，例如：

jQuery("someform(_e(:))somepanel(_e(:))somebutton:first".escape())

这样你可以定义需要转义的内容，但如果是这种情况，你也可以自己进行转义。

- RobertPitt

---

我知道我可以这样做，但我想使用jQuery（somefunction("#someform:somepanel:somebutton")）来实现。 - IAdapter

我更新了我的回答，你未来需要更清晰地提出问题。 - RobertPitt

Answer 3

尝试：

jQuery("#someform\\:somepanel\\:somebutton")

- VoodooChild

---

我知道我可以这样做，但我想用jQuery来完成(somefunction("#someform:somepanel:somebutton"))。 - IAdapter

@01: 我不确定我理解了。你不是想要在上面的评论中转义 : 吗？ - VoodooChild

有没有“somefunction”可以在冒号之前自动添加\到字符串中？ - IAdapter

@01：是的，正如@jAndy在他的答案中所说的那样。简而言之：只需调用somefunction并从中返回yourID.replace(/:/, '\\:');即可。 - VoodooChild

Answer 4

如果您使用 PrimeFaces，他们有一个方便的助手函数可以做到这一点：

escapeClientId(id) - 转义带有分号的JSF ID以与jQuery配合使用。

要调用它：

PrimeFaces.escapeClientId("someform:somepanel:somebutton")

返回：

#someform\\:somepanel\\:somebutton

在内部，它只是调用replace(/:/g,"\\:")并添加#，所以您也可以使用它。

- sleske

Answer 5

我已经创建了一个函数，在jQuery中为JSF转义冒号：

//USAGE: $(espaceIdForJSF('#someId:anotherId'));
function escapeIdForJSF(id) {
   return id.replace(/:/g,"\\:").replace(/\./g,"\\.");
}

- Shervin Asgari

---

非常好用！谢谢！ - Pierre C

Answer 6

使用这个技巧：jQuery($('myid')) 原因：我正在使用“prototype”通过ID查找元素，然后将结果传递给jQuery。

优点：更容易阅读。 缺点：需要Prototype和jQuery，但RichFaces无论如何都使用Prototype。

- gorlok

Answer 7

JQuery 3.0 提供了一个转义函数：

https://api.jquery.com/jQuery.escapeSelector/

$( "#" + $.escapeSelector( evilId ) );

- oleh