-7

我有以下 Javascript 代码，但它不起作用。谁能帮我解决这个问题？

这些是我想要实现的目标：

  1. 将游戏数量增加到用户请求的游戏数量 p1
  2. 检查是否只输入了有效数字 p2
  3. 第一个 10 和第二个 10 p3 之间的换行符

有什么帮助吗？

<html>
    <head>
        <title>processing</title>
    </head>

    <body>
        <form name="processing" action="processing.php" method="POST">
            <input type="hidden" name="check_submit" value="1" />
            <p>Please select the numbers of players:</p>
            <select>
                <SCRIPT Language="JavaScript">
                    for (i = 1; i <= 8; i++) {
                        document.write('<option value="' + i + '">' + i + '</option>');
                    }
                </script>
            </select>
            <input type="submit" />Scores From Game 1:
            <SCRIPT Language="JavaScript">
                for (i = 0; i < 20; i++) {

                    document.write('<input type="number" name="scores[]" min="0" max="10" value="0"/>')

                }
            </script>
            <input type="submit" />
        </form>
    </body>

</html>
4

3 回答 3

2

与其使用 JavaScript，不如直接使用原始 HTML？

...
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</option>
</select>
...
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
<input type="number" name="scores[]" min="0" max="10" value="0"/>
于 2013-04-23T17:11:14.063 回答
1

谁建议它是正确的 -由于' 能够破坏 DOM 使用而避免document.write支持。不仅如此，您还通过将 a放入元素来破坏语义 - 不好。document.creatElementdocument.writescriptselect

让我们重新编写您的代码。假设你有这个：

<select id="NumPlayers">
</select>

而您当前的代码：

 for (i = 1; i <= 8; i++) {
               document.write('<option value="' + i + '">' + i + '</option>');
 }

为了阻止所有地狱般的失败，您可以将其重新加工成这样的东西：

window.onload = function() {
   var selectTag = document.getElementById("NumPlayers");
   for (var i = 0; i <= 8; i++) {
       var c = new Option(i,i);
       selectTag.add(c);
   }
};

这将做三件有价值的事情：

  1. 它会阻止你破坏你的 DOM
  2. 最后它在语义上是正确的（没有脚本->选择子行为）
  3. 它将等到页面加载完成后才修改 DOM。
于 2013-04-23T17:14:03.247 回答
0

不要使用document.write动态插入 HTML 内容，而是使用 DOM API：

o = document.createElement('option');
o.value = i;
o.appendChild(document.createTextElement(i));
select.appendChild(o);

document.write不赞成，因为浏览器预解析器无法优化使用此方法插入的 HTML 内容。如果您尝试执行类似document.write('<img src="pic.jpg"/>');的操作，浏览器必须等到 JavaScript 被解析并执行后才能加载图像。正常插入时，预解析器能够发现图像并预加载pic.jpg。

它不受欢迎的另一个原因是 JavaScript 必须位于您要插入 HTML 的确切位置。这会导致代码碎片化散布在整个 HTML 文档中，这很难维护并且会阻止 HTML 稍后在页面中呈现。

于 2013-04-23T17:11:00.470 回答