-7

次の Javascript コードがありますが、機能していません。誰でもこれで私を助けることができますか?

これらは私が達成したいことです：

  1. ゲーム数をユーザーが要求した数まで増やす p1
  2. 有効な数字のみが入力されているかどうかを確認してください p2
  3. 最初の 10 と 2 番目の 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);
   }
};

これにより、次の 3 つの重要なことが行われます。

  1. DOMを壊すのを防ぎます
  2. 最後に意味的に正しいでしょう（スクリプトなし->子の動作を選択）
  3. DOM を変更するには、ページが読み込まれるまで待機します。
于 2013-04-23T17:14:03.247 に答える
0

を使用して HTML コンテンツを動的に挿入する代わりにdocument.write、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ます。

HTML を挿入したい正確な場所に JavaScript を配置する必要があるため、これが嫌われているもう 1 つの理由です。これにより、断片化されたコードが HTML ドキュメント全体に散らばり、保守が困難になり、ページの後半で HTML のレンダリングがブロックされます。

于 2013-04-23T17:11:00.470 に答える