JavaScript - 从脚本将值写入 html 表单

JavaScript - writing value into html form from script

本文关键字：html 表单 脚本 JavaScript      更新时间：2023-09-26

我想知道如何在带有html的表单中输入值。因此，当用户访问网站时，文本框中已经有数字，他们使用这些数字来玩和"加法游戏"。 这是我到目前为止所拥有的：

     <script type="text/javascript">
    function addSubmit() {
//trying to have num1 and num2 write into the html form
    var num1= Math.floor(89+Math.random()*11);
    var num2 = Math.floor(89+Math.random()*11);
    /*num1 = value1
    num2 = value2*/
    document.getElementById("value1").value = num1;
    document.getElementById("value2").value = num2;
    var guess = document.getElementById("submit").value;
    var answer = num1 + num2;
    //have to write this to main window
    if (guess == answer)
    document.writeln("Congratulations you answered correctly! The answer to: "+num1+"+"+num2+"= "+answer);
    else
    document.writeln("Nice try, but the correct answer to: "+num1+"+"+num2+"= "+answer);
    }
    function addGiveUp() {
    var num1 = Math.floor(89+Math.random()*11)
    var num2 = Math.floor(89+Math.random()*11)
    document.addition.value1.value=num1;
    document.addition.value2.value=num2;
    var guess = document.getElementById("submit").value;
    var answer = (document.getElementById("value1").value) + (document.getElementById("value2").value);
    document.writeln("Never give up! The answer to: "+num1+"+"+num2+"= "+answer);
    }
    </script>
    <form name="addition" action="" method="get">
    <table border="1">
             <tr>
         <td>Value 1:</td> <td><input type="text" name="value1" id="value1"/></td>
                 </tr>
             <tr>
         <td>Value 2:</td> <td><input type="text" name="value2" id="value2"/></td>
                 </tr>
             <tr>
         <td>Answer:</td> <td><input type="text" id="answerswer" /></td>
                 </tr>
             <tr><td><input type="button" value="Submit" onClick="addSubmit()" id="submit" /></td><td><input type="button" value="Give Up" onClick="addGiveUp()" /></td></tr>
             </table>
    </form>

我感谢任何帮助！谢谢！

您可以在创建表单后放置此脚本：

<form name="addition" action="" method="get">
            <table border="1">
                     <tr>
                 <td>Value 1:</td> <td><input type="text" name="value1" id="value1"/></td>
                         </tr>
                     <tr>
                 <td>Value 2:</td> <td><input type="text" name="value2" id="value2"/></td>
                         </tr>
                     <tr>
                 <td>Answer:</td> <td><input type="text" id="answerswer" /></td>
                         </tr>
                     <tr><td><input type="button" value="Submit" onClick="addSubmit()" id="submit" /></td><td><input type="button" value="Give Up" onClick="addGiveUp()" /></td></tr>
                     </table>
</form>
<!-- This is the script-->
 <script type="text/javascript">
      document.getElementById("value1").value = Math.floor(89+Math.random()*11);
      document.getElementById("value2").value = Math.floor(89+Math.random()*11);​
  </script>

这将为您生成随机数并将它们放入表单中代码请参阅此处：http://jsfiddle.net/wVAFt/

<input type="text" id="answerswer" value="5" >
or
document.getElementById("answerswer").value = "5";

要在输入字段中包含数字，您可以将它们设置为具有一个值，例如 value="10"，默认值将为 10，直到用户更改它。

相关文章：