javascript - jQueryはJSONから選択リストオプションを作成しますが、宣伝どおりには発生しませんか？

Question

なぜこれが機能しないのですか（空の選択リストを操作する<select id="requestTypes"></select>

$(function() {

        $.getJSON("/RequestX/GetRequestTypes/", showRequestTypes);

    }
    );


    function showRequestTypes(data, textStatus) {

        $.each(data,
            function() {

                var option = new Option(this.RequestTypeName, this.RequestTypeID);
                // Use Jquery to get select list element
                var dropdownList = $("#requestTypes");

                if ($.browser.msie) {
                    dropdownList.add(option);
                }

                else {

                    dropdownList.add(option, null);

                }
            }
            );

        }

しかし、これはします：

• 交換：

  var dropdownList = $("#requestTypes");

• プレーンな古いJavaScriptの場合：

  var dropdownList = document.getElementById("requestTypes");

Answer 1

$("#requestTypes")選択されたすべての要素を含む jQuery オブジェクトを返します。個々の要素のメソッドを呼び出そうとしてadd()いますが、代わりにadd()jQuery オブジェクトのメソッドを呼び出しています。これは非常に異なることを行います。

DOM 要素自体にアクセスするには、jQuery オブジェクトを配列として扱い、$("#requestTypes")[0].

Answer 2

デフォルトでは、jQueryセレクターはjQueryオブジェクトを返します。これを追加して、DOM要素を返します。

 var dropdownList = $("#requestTypes")[0];

Answer 3

このようなものには、単純な ajaxAddOption 関数を備えたtexotela の選択ボックス プラグインを使用します。