＆lt; select＆gt;をループします＆＃8220; value1＆＃8221;、＆＃8220; value2＆＃8221;、＆＃8220; value3＆＃8221;の形式で配列を作成します

Question

jcodeを使用して＆lt; select＆gt; 要素内のすべての＆lt; option＆gt; をループし、配列を構築する最良の方法を提案できる人はいないだろうか。

例：

次の代わりに、文字列insがautoCompleteArray（）に渡されます

$("#CityLocal").autocompleteArray(
        [
            "Aberdeen", "Ada", "Adamsville", "Zoar" //and a million other cities...
        ],
        {
            delay:10,
            minChars:1,
            matchSubset:1,
            onItemSelect:selectItem,
            onFindValue:findValue,
            autoFill:true,
            maxItemsToShow:10
        }
    );

... ＆lt; select＆gt; 内のすべての＆lt; option＆gt; をループして配列にプッシュし、その配列変数を渡す必要があります長い文字列の代わりに関数に。

たとえば、

$("#CityLocal").autocompleteArray(
            [
                MyBigArrayOfOptions
            ],
            {
                delay:10,
                minChars:1,
                matchSubset:1,
                onItemSelect:selectItem,
                onFindValue:findValue,
                autoFill:true,
                maxItemsToShow:10
            }
        );

正しい形式で配列にデータをプッシュする方法を提案できれば、ありがたいです。私はこのサイトの別の投稿からループ部分をほとんど調べました。

ありがとう。

Answer 1

これは動作するはずです：

$(document).ready(function(){
  // array of option elements' values
  var optionValues = [];
  // array of option elements' text
  var optionTexts = [];

  // iterate through all option elements
  $('#sel > option').each(function() {
    // get value/text and push it into respective array
    optionValues.push($(this).val());
    optionTexts.push($(this).text());
  });

  // test with alert
  alert(optionValues);
  alert(optionTexts);
});

select 要素のIDが sel であることを考えてください。

Answer 2

jQuery.map 関数が探しているものです。以下のコードは、＆lt; select＆gt; オプションのすべての値またはテキスト値を含む配列を作成します。

var values = jQuery.map(jQuery("#select")[0].options, function(option)
             {
                return option.value;
             });

var texts = jQuery.map(jQuery("#select")[0].options, function(option)
            {
                return option.innerHTML;
            });

Answer 3

する必要があるのは、角括弧なしで最初のパラメータとして配列を渡すことだけです。ブラケットは新しい配列を作成しますが、配列を既に渡しているため、その必要はありません。ただやる：

$("#CityLocal").autocompleteArray(
                MyBigArrayOfOptions,
                {
                        delay:10,
                        minChars:1,
                        matchSubset:1,
                        onItemSelect:selectItem,
                        onFindValue:findValue,
                        autoFill:true,
                        maxItemsToShow:10
                }
        );

Answer 4

あなたの質問を誤って理解した場合、次のコードで必要なことを行う必要があります。

myFunction($("#my-select option"));

クエリの出力は既にselectの子孫であるオプションの配列であるため、別の配列にプッシュする必要はありません。あるいは、selectにidがなく、DOM要素がある場合：

myFunction($("option", theSelect));

このアイデアをコードに戻す：

$("#CityLocal").autocompleteArray(
    $("option", theSelect),
    {
            delay:10,
            minChars:1,
            matchSubset:1,
            onItemSelect:selectItem,
            onFindValue:findValue,
            autoFill:true,
            maxItemsToShow:10
    }
);