HTML 表单输入到 Javascript var 到 document.write答案

【问题标题】：HTML form input to Javascript var to document.writeHTML 表单输入到 Javascript var 到 document.write
【发布时间】：2014-08-28 06:34:20
【问题描述】：

这是我目前得到的代码。它根本不起作用。我想在输入中输入一个单词。提交表单时，输入值变为 Javascript 变量“germsearch”。然后 document.write 整个页面，使其具有这六个框架（其中五个的 src 包含变量“germsearch”）。基本上，这个想法是你搜索一个词，它会加载五个框架在不同的字典中搜索（保持第六个框架在顶部以保留搜索框）。

<head>
<script type="text/javascript" language="javascript">
  function run() {
     var germsearch = document.getElementById("german").value;
     document.write("<html><head><title>GERMANICVS</title></head>
          <frameset rows=\"10%, 90%\">
            <frame src=\"searchbox.html\">
            <frameset cols=\"20%, 20%, 20%, 20%, 20%\">
              <frame src=\"http://de-is.pocket.dict.cc/?s=" +germsearch+ "\">
              <frame src=\"http://de-sv.pocket.dict.cc/?s=" +germsearch+ "\">
              <frame src=\"http://de-nl.pocket.dict.cc/?s=" +germsearch+ "\">
              <frame src=\"http://de-no.pocket.dict.cc/?s=" +germsearch+ "\">
              <frame src=\"http://de-da.pocket.dict.cc/?s=" +germsearch+ "\">
            </frameset>
          </frameset></html>"); }
</script>
</head>

<body>
<form onSumbit="run()">
  <input type="text" id="german" value="">
  <input type="submit" value="GERMANIFY">
</form>
</body>

提前致谢，劳埃德

【问题讨论】：

标签： javascript html input var document.write

【解决方案1】：

改变

<form onSumbit="run()">

到

<form onSubmit="run()">

另外，将您的 document.write 更改为

document.write('<html><head><title>GERMANICVS</title></head><frameset rows=\"10%, 90%\"><frame src=\"searchbox.html\"><frameset cols=\"20%, 20%, 20%, 20%, 20%\"><frame src=\"http://de-is.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-sv.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-nl.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-no.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-da.pocket.dict.cc/?s=" +germsearch+ "\"></frameset></frameset></html>');

（单行）或者在换行符之前使用反斜杠。

【讨论】：

非常感谢，我只是在一个错字上浪费了太多时间...还有一个小问题，“searchbox.html”是编写此代码的页面（因此 seachbox 页面会重新加载顶部框架）。但是当您再次尝试使用它时，document.write 只会重写该顶部框架。如何让它再次覆盖整个页面？
@dlph 您可以在document.write() 之前尝试document.body.outerHTML=''。
不幸的是，这似乎也不起作用。不过也没什么大不了的，只是我自己用的一个随便的页面而已。非常感谢您的帮助。
@dlph 欢迎您。我希望你能解决你的问题:)

【解决方案2】：

我修正了你的答案，它显示了你正在尝试做的事情首先，我更改了您的表单，因为当您可以使用 document.forms 时，使用 document.getElementByID 获取值对我来说感觉不对我还使用了一个“按钮”标签而不是普通的“提交”按钮，一切都像你想要的那样工作。

希望这会有所帮助:)

<html>
<head>
    <script type="text/javascript" language="javascript">
      function run() {
         var germsearch = document.forms["myForm"]["german"].value;
         alert(germsearch);
         document.write('<html><head><title>GERMANICVS</title></head><frameset rows=\"10%, 90%\"><frame src=\"searchbox.html\"><frameset cols=\"20%, 20%, 20%, 20%, 20%\"><frame src=\"http://de-is.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-sv.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-nl.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-no.pocket.dict.cc/?s=" +germsearch+ "\"><frame src=\"http://de-da.pocket.dict.cc/?s=" +germsearch+ "\"></frameset></frameset></html>'); }
    </script>
</head>

<body>
    <form name="myForm" >
      <input type="text" name="german">
      <button type="button" onclick="run()">Submit</button>
    </form>
</body>

【讨论】：

啊，太好了，谢谢。我从来没有明确地学习过任何javascript，所以我什至不知道“表单”是一个东西（可能有自己名字的“东西”的类型）。关于按钮/提交的一点 - 我使用 onSubmit 而不是 onClick 以便您可以使用 enter 键提交表单而您没有单击按钮
我也正常尝试了提交按钮，当我点击提交按钮时，它不会调用“运行”功能，所以我继续制作一个实际按钮并将其标记为提交，所以它确实有效，我认为使用 enter 也可以在这里工作，但我从未检查过:)