jQuery выбирает элементы опций по значению

89

У меня есть элемент выбора, обернутый элементом диапазона. Мне не разрешено использовать выбранный идентификатор, но мне разрешено использовать идентификатор диапазона. Я пытаюсь написать функцию javascript / jquery, в которой входом является число i, которое является одним из значений параметров выбора. Функция переключит соответствующий параметр на выбранный.

<span id="span_id">
    <select id="h273yrjdfhgsfyiruwyiywer" multiple="multiple">
        <option value="1">cleaning</option>
        <option value="2">food-2</option>
        <option value="3">toilet</option>
        <option value="4">baby</option>
        <option value="6">knick-knacks</option>
        <option value="9">junk-2</option>
        <option value="10">cosmetics</option>
    </select>
</span>

Я написал следующее (это не совсем работает, поэтому я публикую этот вопрос):

function select_option(i) {

    options = $('#span_id').children('select').children('option');
    //alert(options.length); //7
    //alert(options[0]); //[object HTMLOptionElement]
    //alert(options[0].val()); //not a jquery element
    //alert(options[0].value); //1

    //the following does not seem to work since the elements of options are DOM ones not jquery's
    option = options.find("[value='" + i + "']");
    //alert(option.attr("value")); //undefined
    option.attr('selected', 'selected');

}

Благодарность!

увлеченный
источник

Ответы:

150

Вот простейшее решение с четким селектором:

function select_option(i) {
  return $('span#span_id select option[value="' + i + '"]').html();
}
jonathan.cone
источник
34

С jQuery> 1.6.1 лучше использовать этот синтаксис:

$('#span_id select option[value="' + some_value + '"]').prop('selected', true);
дамуайзер
источник
29

Просто оберните свой вариант в $ (option), чтобы он действовал так, как вы хотите. Вы также можете сделать код короче, выполнив

$('#span_id > select > option[value="input your i here"]').attr("selected", "selected")
Адриан Родригес
источник
6

Вы можете использовать .val () для выбора значения, как показано ниже:

function select_option(i) {
    $("#span_id select").val(i);
}

Вот jsfiddle: https://jsfiddle.net/tweissin/uscq42xh/8/

Том
источник
На каком браузере / платформе у вас это не сработало? На Mac / Chrome он успешно выбирает элемент в списке, что в точности соответствует исходному вопросу.
Tom
@ Мистер Ллама, возможно, вы неправильно поняли вопрос. Код @Tom делает то, о чем просили: для заданного значения iвыберите i-й optionв select. OP не пытался фильтровать варианты.
Пол
4

Чтобы получить значение, просто используйте это:

<select id ="ari_select" onchange = "getvalue()">
<option value = "1"></option>
<option value = "2"></option>
<option value = "3"></option>
<option value = "4"></option>
</select>

<script>
function getvalue()
{
    alert($("#ari_select option:selected").val()); 
}
</script>

это получит значения

Ариджит Гош
источник
1
function select_option(index)
{
    var optwewant;
    for (opts in $('#span_id').children('select'))
    {
        if (opts.value() = index)
        {
            optwewant = opts;
            break;
        }
    }
    alert (optwewant);
}
Хоган
источник
Спасибо! Я не знаю, что такое внутренняя реализация jQuery, но другие решения выглядят проще.
рапт
Если у вас уже есть jQuery, это проще, но я подумал, что вы, возможно, захотите узнать, как это сделать на чистом js.
Hogan
0
$("#h273yrjdfhgsfyiruwyiywer").children('[value="' + i + '"]').prop("selected", true);
rsc
источник