复合组件中的 jQuery 选择器，为什么它不起作用？答案

【问题标题】：jQuery selectors in Composite components, why it doesn't work?复合组件中的 jQuery 选择器，为什么它不起作用？
【发布时间】：2015-01-25 14:01:35
【问题描述】：

我尝试使用 jQuery 选择器选择 JSF 组件。复合组件 .xhtml 和 .js 相关代码是分开的，所以我在变量中传递cc.cliendId 如下：

var variables = {};
variables.formid = "#{cc.clientId}";

在 *.js 文件中，我尝试按以下方式使用它：$('[id="'+variables.formid+'"]') 它可以工作并返回一个完整的 div，但以下代码不起作用，它返回一个空对象[]：

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

 $("#" + escapeColons(variables.formid))

转义冒号的函数取自这个答案：https://stackoverflow.com/a/4792023/947111

如果我写 $("#" + "form\\:range_chooser")，range_chooser 是我的复合组件的 id，它可以工作。

【问题讨论】：

那么返回：escapeColons(variables.formid)?
form\\:range_chooser 作为字符串
尝试在没有var 的情况下声明variables。我看不到你的 JS 作用域的全貌....

标签： jquery jsf composite-component

【解决方案1】：

这并不能解决您的具体问题，但我一直发现将分隔符更改为不冲突的内容比不断转义 ID 更容易。您可以通过将上下文参数添加到您的 Web.xml 来做到这一点。即：

<context-param>
    <param-name>javax.faces.SEPARATOR_CHAR</param-name>
    <param-value>-</param-value>
</context-param>

我可能应该补充一点，如果您在任何地方都硬编码了冒号，那么您必须返回并更改所有这些。因此，根据您的设置，这可能比它的价值更麻烦。

编辑

如果您需要按原样保留分隔符字符，您应该能够稍微简化一下 javascript：

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

$("#" + escapeColons(variables.formid))

反正对我有用。

【讨论】：