9

在 JSF 中,将 JavaScript 集成到复合组件中的“正确”和“干净”方式是什么?我是Unobtrusive JavaScript的粉丝,并将 HTML 与 JS 与 CSS 分开。什么是尽可能少的怪癖的好方法?这是迄今为止我最喜欢的:

<composite:interface>
  // ...
</composite:interface>

<composite:implementation>
  // ...
  <script> initSomething('#{cc.clientId}'); </script>
</composite:implementation>    

我不喜欢的是,用来language A生成language B. 事件处理程序和其他东西基本上也是如此。我最喜欢的是通过<insert favorite DOM JavaScript library here>. 这可能吗?您如何进行这种集成?

4

1 回答 1

9

我想说的是,只要您绝对肯定 HTML 元素的性质是如此独特,以至于您每次都绝对需要通过 ID 选择它,那么您所拥有的就是您能得到的最好的。

如果 HTML 表示不是唯一的(我可以想象 Facelets 模板或包含文件可能包含应用程序范围内的唯一 HTML 元素,如页眉、菜单、页脚等,但是可以在单个视图中多次重用的复合组件?我无法想象),那么您也可以考虑使用唯一的类名并对其进行挂钩初始化。

例如/resources/composites/yourComposite.xhtml

<cc:implementation>
    <h:outputScript library="composites" name="yourComposite.js" target="head" />
    <div id="#{cc.clientId}" class="your-composite">
        ...
    </div>
</cc:implementation>

with in /resources/composites/yourComposite.js(假设您使用的是 jQuery)

var $yourComposites = $(".your-composite");
// ...

如有必要,您可以在 a 中为每个元素提取自动生成的 HTML 元素 ID jQuery.each()

$yourComposites.each(function(index, yourComposite) {
    var id = yourComposite.id;
    // ...
});
于 2012-09-27T17:53:25.817 回答