无法在 jsf 页面中执行 Javascript

Can't execute Javascript in jsf page

本文关键字:执行 Javascript jsf      更新时间:2023-09-26

我是jsf的新手。我一直在尝试使用命令按钮做一个简单的Javascript函数。我尝试了很多次,但甚至无法发出警报消息。这是我代码的一部分。请谁能指导我,告诉我出了什么问题,我应该怎么做才能让它运行?

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:f="http://java.sun.com/jsf/core">
<h:head>
  <script type="text/javascript">
  function test(){
    alert('test');
    alert(document.getElementById('frmDashBoard:testbt').value);
  }
  </script>
</h:head>
<h:body>
  <ui:composition template="../../template/commonLayout.xhtml"> 
    <ui:define name="content">
      <div>
        <h:form id="frmdashboard">
          <div name="form_panel" style="width: 984px">
               <h:commandButton id="testbt" value="#{message.btn_dashboard_search}" action="#{searchBLAction.doAction}" onclick="test()" />
          </div>
        </h:form>
      </div>
    </ui:define>
  </ui:composition>     
</h:body> 
</html>

除了这个小写/大写的拼写错误(顺便说一下,这根本不会导致函数被调用),您的具体问题之所以引起,是因为此页面被设计为使用 <ui:composition> 的模板客户端。<ui:composition>标记之外的任何内容在运行时都会 Facelet 忽略。此内容仅对可视化 Web 设计人员有用,但一旦在运行时编译和执行,就会完全忽略它。相反,合成的内容将插入到主模板中,在您的情况下commonLayout

您需要将<script>元素放入<ui:define>中,这样它将被带入最终的 Facelet 组合中。

<ui:define name="...">
    <script>
        ...
    </script>
    ...
</ui:define>

或者,更好的是,将 JS 函数放在 /resources 文件夹中自己的 JS 文件中,并按如下方式引用它:

<ui:define name="...">
    <h:outputScript name="some.js" target="head" />
    ...
</ui:define>

由于target="head",它将在构建视图时自动重新定位到 HTML <head>中。

另请参阅:

  • 如何使用JSF 2.0 Facelets在XHTML中包含另一个XHTML?

在 ui:composition 之外定义的任何内容都将被忽略。因此,将您的内容放在此标签中,它将起作用:像这样:

<ui:composition template="/WEB-INF/tags/layout.xhtml"> 
<ui:include src="/tags/common.xhtml"></ui:include>  
<ui:define name="content">
<h:outputScript name="validation.js" library="javascript"></h:outputScript>