Javascript - 显示一个 commandLink 然后消失答案

【问题标题】：Javascript - showing a commandLink and then DisappearingJavascript - 显示一个 commandLink 然后消失
【发布时间】：2015-11-18 16:17:57
【问题描述】：

我正在开发一个 JSF 应用程序并且想要一个简单的功能——单击命令按钮并显示一个命令链接。我做了一个测试。代码：

<!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" /> 显示立即消失。有人有什么建议吗？非常感谢！

【问题讨论】：

我试过了，但它不起作用。链接根本不显示。另一件事，该文件是一个 .xhtml 文件并在 Tomcat 上运行。
按钮默认提交，一直提交整个表单。请看我的回答来检查
谢谢，我想是这个原因。另一个问题 - 是否可以通过 h:commandButton 放置按钮？
是的，你可以。但请记住在此处也使用 type="button"。如果一切正常，你可以选择我的答案并投票吗？
3 个赞和 1 个最爱？哇...好问题。这个“jsf”有什么关系？

标签： javascript css jsf

【解决方案1】：

我将您的 xhtml 更改为并且可以正常工作。我将按钮类型更改为按钮而不是默认提交。我也将 body 更改为 h:body。你可以像我一样保留 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>

【讨论】：

是的，伟大的马亨德兰！非常感谢！
你能用你在三角形下方看到的绿色勾号来选择我的答案，并可能投票给它。
我选择了你的答案。 :) 支持它 - 怎么做？我只是投票 - 首先回答最高分。对吗？
点击0上方的三角形。
嗯，是的，也不是……但只是“赞成”针对您的“感谢”评论或您的回答被接受的声明有点奇怪（就像上面的两个赞成一样）。你例如应该对原始发帖人以外的其他人的评论表示赞同，即应该提供更好的示例，或者提出其他人的建议以尝试特定的事情（在他/她提供答案之前）。在这些情况下，如果其他人试图寻找原因，您不应该直接提供答案来“劫持”问题。所有“礼貌”的东西