Прокрутите <select> и создайте массив в формате: «значение1», «значение2», «значение3»

Интересно, может ли кто-нибудь предложить лучший способ перебрать все <option> в элементе <select> с помощью jQuery и построить массив.

Например.

Вместо следующего, в котором строка 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
        }
    );

... Мне нужно перебрать все <options> в <select>, вставить их в массив и просто передать эту переменную массива в функцию вместо длинной строки.

Например,

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

Буду признателен, если вы подскажете, как поместить данные в массив в правильном формате. Я почти понял, что такое зацикливание, из другого поста на этом сайте.

Спасибо.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
4
0
8 646
4
Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Ответ принят как подходящий

Это должно работать:

$(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 имеет идентификатор сел.

Как бы вы отфильтровали это только для выбранных элементов?

Jan de Jager 23.07.2009 16:59

В цикле .each: if (this.selected) {// код для push}

Damir Zekić 24.07.2009 19:39

Функция 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;
            });

Все, что вам нужно сделать, это передать массив в качестве первого параметра без скобок. Скобки создают новый массив, но вам не нужно этого делать, потому что вы уже передаете массив. Просто сделать:

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

Если я правильно понимаю ваш вопрос, следующий код должен делать то, что вам нужно:

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

Результатом запроса уже является массив параметров, которые являются потомками select, поэтому вам не нужно помещать их в другой массив. В качестве альтернативы, если у вашего выбора нет идентификатора, но у вас есть элемент 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") создает массив в желаемом формате?

Chris J Allen 24.10.2008 12:57

Другие вопросы по теме