Question

我希望在点击链接后显示表单。在同一页上。为什么这段代码不起作用？

<a href="javascript:;" onclick="forgot();" class="txtmenu">Click Here if you forgot your password</a>

<script type='text/javascript'>
function forgot()
{
  document.write("

<form action=\"<?php echo $_SERVER['PHP_SELF']?>\" method=\"post\" > 
<table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">
  <tr>
    <td>Enter your email</td>
  </tr>
   <tr>
    <td><input type=\"text\" name=\"username\" maxlength=\"40\" class=\"form-field\" ><input class=\"submit-button\" type=\"submit\" name=\"forgot\" value=\"SEND MY PASS\" /></td>
  </tr>
</table>
</form>

 ");  
}
</script>

Answer 1

您必须在多行字符串的所有行末尾添加\符号。

像：

function forgot()
{
document.write("\
<form action=\"<?php echo $_SERVER['PHP_SELF']?>\" method=\"post\" >\
<table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">\
  <tr>\
    <td>Enter your email</td>\
  </tr>\
   <tr>\
    <td><input type=\"text\" name=\"username\" maxlength=\"40\" class=\"form-field\" ><input class=\"submit-button\" type=\"submit\" name=\"forgot\" value=\"SEND MY PASS\" /></td>\
  </tr>\
</table>\
</form>\
 ");  
}

Answer 2

它不起作用，因为你不能像这样在多行上拆分字符串。虽然我不建议您使用document.write按照自己的方式进行操作，但您可以通过以下方式修复它：

function forgot()
{
  document.write(

"<form action=\"<?php echo $_SERVER['PHP_SELF']?>\" method=\"post\" > " +
"<table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\"" +
      "align=\"center\">" +
  "<tr>"+
    "<td>Enter your email</td>"+
  "</tr>"+
   "<tr>"+
    "<td><input type=\"text\" name=\"username\" maxlength=\"40\""+ "class=\"form-field\" ><input class=\"submit-button\" type=\"submit\""+ "name=\"forgot\" value=\"SEND MY PASS\" /></td>"+
  "</tr></table></form>"

 );  
}

这很丑，但是如果你要使用document.write那么它并不重要;）

Answer 3

文档加载完成后，您不应该只是document.write。它不会让你有任何好处。您应该为元素设置一些id，并在稍后发生某些事件时对其进行修改。

例如，你创建了一个div，其中id =“myDIV”并使其不可见，只需点击

var itisMyDiv = document.getElementById("myDIV");
itIsMyDiv.style.visibility = "visible";

或类似的东西。

Answer 4

您必须在多行字符串的所有行末尾添加\符号，或使用字符串连接（请参阅here）。

<a href="javascript:;" onclick="forgot()" class="txtmenu">Click Here if you forgot your password</a>
<script type='text/javascript'>
    function forgot()
    {
    document.write("\
    <form action=\"<?php echo $_SERVER['PHP_SELF']?>\" method=\"post\" >\
    <table width=\"300\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">\
      <tr>\
        <td>Enter your email</td>\
      </tr>\
       <tr>\
        <td><input type=\"text\" name=\"username\" maxlength=\"40\" class=\"form-field\" ><input class=\"submit-button\" type=\"submit\" name=\"forgot\" value=\"SEND MY PASS\" /></td>\
      </tr>\
    </table>\
    </form>\
     ");  
    }
</script>

使用document.write()是个坏主意，因为它会覆盖整个文档。一种快速且更好的方法是设置一些div，为该div分配id属性，然后在forgot()函数中使用document.getElementById检索div，并通过分配您的内容来替换内容字符串到innerHTML属性。

JavaScript onclick不在页面上显示

4 个答案: