循环 <select> 并以以下格式构建数组："value1","value2","value3"答案

【问题标题】：Loop through <select> and build array in the format: "value1","value2","value3"循环 <select> 并以以下格式构建数组："value1","value2","value3"
【发布时间】：2010-09-18 21:38:24
【问题描述】：

我想知道是否有人可以建议使用 jQuery 循环遍历 <select> 元素中的所有 <option> 并构建数组的最佳方法。

例如。

而不是下面的，将字符串 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
        }
    );

...我需要遍历<select> 中的所有<options> 并将它们推送到一个数组中，然后将该数组变量传递给函数而不是一个长字符串。

例如，

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

如果您能建议如何以正确的格式将内容推送到数组中，我将不胜感激。我已经从本网站的另一篇文章中猜到了循环部分。

谢谢。

【问题讨论】：

标签： javascript jquery autocomplete

【解决方案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。

【讨论】：

你将如何只过滤选定的项目？
在.each 循环中： if (this.selected) { // 推送代码 }

【解决方案2】：

jQuery.map 函数可能正是您想要的。下面的代码将创建一个数组，其中包含 <select> 选项的所有值或文本值。

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;
            });

【讨论】：

【解决方案3】：

您需要做的就是将数组作为第一个参数传递，不带括号。括号创建一个新数组，但您不需要这样做，因为您已经在传递一个数组。做吧：

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

【讨论】：

【解决方案4】：

如果我正确理解您的问题，以下代码应该可以满足您的需求：

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

查询的输出已经是一个选项数组，它们是选择的后代，因此您不需要将它们推入另一个数组。或者，如果您的选择没有 id，但您有 DOM 元素：

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

将这个想法重新插入到您的代码中：

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

【讨论】：

对不起，我看不出这个特定的例子是如何工作的。 $("#my-select option") 如何生成所需格式的数组？