Question

我正在开发一个JSF应用程序，想要一个简单的函数 - 单击命令按钮并显示一个commandLink。我做了一个测试。代码：

<!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">

 <head>
  <script type="text/javascript">
   function testfunc() {
     document.getElementById("testForm:test").style.display="block";
     document.getElementById("testForm:test").style.visibility="visible";
   }
   </script>
 </head>

<body>

   <h:form id = "testForm" >
     <h:panelGroup id="test" style="display:none" >
          <h:commandLink value="Page 1" action="page1" /><br/>
     </h:panelGroup>
     <button onclick="testfunc()">Click me</button>
  </h:form> 

 </body>
</html>

问题是链接 - <h:commandLink value="Page 1" action="page1" />会立即显示消失。有没有人有任何建议？非常感谢！

Answer 1

我将你的xhtml改为了，它有效。我将按钮类型更改为按钮而不是默认提交。我也把身体变成了h：身体。您可以像我一样保留panelGroup或使用panelGrid。

  <!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">

    <head>
     <script type="text/javascript">
     function testfunc() {
      document.getElementById("testForm:test").style.display="block";
    document.getElementById("testForm:test").style.visibility="visible";
    }
   function hidefunc() {
     document.getElementById("testForm:test").style.display="none";
     document.getElementById("testForm:test").style.visibility="hidden";
   }
    </script>
</head>

<h:body>

  <h:form id = "testForm" >
      <h:panelGrid id="test" style="display:none" >
        <h:commandLink value="Page 1" action="page1" /><br/>
       </h:panelGrid>
       <button onclick="testfunc()" type="button">Show me</button>
       <button onclick="hidefunc()" type="button">Hide me</button>
     </h:form> 

    </h:body>
 </html>

Javascript - 显示一个commandLink，然后消失

1 个答案: