未在 <script> 块内解析 JSF 组件

Jor*_*rge 4 javascript jsf facelets

我不得不更改<script> ... </script>JSF 页面中的 a 并尝试评估脚本内的 JSF 组件。EL 已评估,但标签本身未受影响。

这种行为的原因是什么?

例子:

<script type="text/javascript">
    //<![CDATA[
        function doSomething() {
            $('.userNode').droppable({
                activeClass : 'ui-state-active',
                hoverClass : 'ui-state-highlight',
                tolerance : 'intersect',
                drop : function(event, ui) {
                   <h:panelGroup rendered="#{myBean.useThis}">
                     alert("code A");
                   </h:panelGroup>
                   <h:panelGroup rendered="#{!myBean.useThis}">
                     alert("code B");
                   </h:panelGroup>
        }
            });
        };
    //]]>   </script>
Run Code Online (Sandbox Code Playgroud)

EL#{!myBean.useThis}被评估为真/假,但<h:panelGroup>在渲染结果中。

为什么?

Bal*_*usC 5

这是因为你把它放在一个 CDATA 块中。CDATA 块内的任何内容都被视为字符数据,而不是 XML 数据。

最好不要这样做。这是一个糟糕的做法。将 JS 函数放在它自己的.js文件中。仅使用 JSF/EL 准备 JavaScript 变量,然后 JS 函数将要求(作为方法参数)或自行访问(在窗口范围内),而不是填充部分 JS 函数。

例如

<h:outputScript>var useThis = #{myBean.useThis};</h:outputScript>
<h:outputScript name="script.js" />
Run Code Online (Sandbox Code Playgroud)
function doSomething() {
    $('.userNode').droppable({
        activeClass : 'ui-state-active',
        hoverClass : 'ui-state-highlight',
        tolerance : 'intersect',
        drop : function(event, ui) {
           if (useThis) {
               alert("code A");
           }
           else {
               alert("code B");
           }
        }
    });
}
Run Code Online (Sandbox Code Playgroud)

为防止污染全局范围,请考虑创建命名空间。

<h:outputScript>var my = my||{}; my.useThis = #{myBean.useThis};</h:outputScript>
Run Code Online (Sandbox Code Playgroud)
           if (my.useThis) {
               alert("code A");
           }
           else {
               alert("code B");
           }
Run Code Online (Sandbox Code Playgroud)

也可以看看: