0

ドロップダウン リストに入力したいので、次のコードを記述しました。

<script language="JavaScript1.2">
window.onload = fillDropDown();

function fillDropDown() {

        var ddl = document.getElementById("dia");
    var theOption = new Option;
    var x;
    var i;

    for(i = 1; i < 32; i++) {
        x = i + 1;
        theOption.text = x;
        theOption.value = x;
        ddl.options[i] = theOption;
    }


}

</script>
   <body>
    <form>
           <select id=dia></select>
    </form>
   <body>

機能していません。理由はわかりますか？

4

2 に答える 2

7

コードにいくつかのエラーがあります。

1.最初のよくある間違いは次のとおりです。

window.onload = fillDropDown();

この前のコードは、呼び出された関数の結果を登録し、fillDropDownその結果を に代入していますwindow.onload。したがって、これは決して何もしません。イベントを登録するには、呼び出された関数の結果ではなく、関数を割り当てる必要があります。違いは次のとおりです。

window.onload = fillDropDown; // Without the parentheses.

2.私が見つけたもう 1 つの間違いは、option要素の作成に関するものです。JavaScript で HTML 要素を作成するより良い方法は、ほぼ標準の関数を使用することです document.createElement。

3. HTML マークアップにもエラーがあります。あなたselectは書かれています：<select id=dia></dia>そしてそれはあるべき<select id="dia"></select>です;

したがって、これらすべての変更を強調表示すると、結果のコードは次のようになります。

window.onload = fillDropDown;

function fillDropDown() {

    var ddl = document.getElementById("dia");
    var theOption;
    var x;
    var i;

    for (i = 1; i < 32; i++) {
        x = i + 1;
        theOption = document.createElement('option');
        theOption.label = x;
        theOption.value = x;
        ddl.add(theOption, null);
    }


}​

そして、それは魅力のように機能します。このライブ デモで実際の動作を確認できます: http://jsfiddle.net/dyjLS/

注:このような JavaScript ライブラリを使用することを強くお勧めjQueryします。これは、ほぼすべてのブラウザー間の不一致に対処できるからです。これを使用すると、コードは次のようになります。

<script type="text/javascript">
  jQuery( document ).ready( function($) {
    var $select = $('#dia');
    for ( var i = 1 ; i < 32 ; i++) {
      var x = i + 1;
      $select.append('<option value='+ x +'>'+ x +'</option>');
    }
  });
</script>

ほら！

于 2012-05-02T01:00:28.880 に答える
4

<script language="JavaScript1.2">あるべき<script type="text/javascript">
またwindow.onload = fillDropDown();あるべきwindow.onload = fillDropDown;

于 2012-05-02T01:02:44.077 に答える