Как предварительно выбрать опцию в окне выбора с помощью jQuery - PullRequest
Новая
       4

Как предварительно выбрать опцию в окне выбора с помощью jQuery

14 голосов
/ 24 июня 2010

У меня есть одно поле выбора с различными вариантами.

Когда страница загружается, один вариант со значением, например 10, должен быть предварительно выбран с помощью jQuery.

Как я могу это сделать?

Ответы [ 5 ]

24 голосов
/ 24 июня 2010

Когда страница загружается, запустите это (вы можете поместить его в <body onload="//put code here">): 

$("option[value='10']").attr('selected','selected');
19 голосов
/ 24 июня 2010

Проверьте пример: http://jsfiddle.net/VArCZ/

$(document).ready(function() {

    $('#mySelectBox').val('10');

});

Хотя jQuery для этого не понадобится, если начальное значение будет статическим: 

<select id='mySelectBox'>
    <option value='5'>5</option>
    <option value='10' selected='selected'>10</option>
    <option value='15'>15</option>
</select>​
0 голосов
/ 12 октября 2016

В последней версии jQuery это работает для меня: 

$("option[value='10']").prop('selected',true);
0 голосов
/ 22 сентября 2016

Это то, что я повторно использую в своем коде. Надеюсь, что это поможет. Вы можете включить вывод консоли, чтобы увидеть, что происходит. С помощью этой функции вы можете сопоставить желаемую опцию на основе значения опции или текста опции, как показано в примере ниже.

HTML: 

<select id="languages">
 <option value="01">JAVA</option>
 <option value="02">HTML</option>
</select>

<select class="data-interchange">
 <option value="A">JSON</option>
 <option value="B">XML</option>
</select>

JavaScript (с использованием Jquery) 

$(function() {
  preSelectDropDownList("#languages", "val", "02");
  preSelectDropDownList(".data-interchange", "text", "XML");

  function preSelectDropDownList(selector, checkAgaints, neddle) {
    //console.log(selector, checkAgaints, neddle);//DEBUG
    let hayStack = "";
    neddle = neddle == null ? "" : neddle;
    $(selector + " option").filter(function() {
        if (checkAgaints === "text") {
            hayStack = $(this).text();
        } else if (checkAgaints === "val") {
            hayStack = $(this).val();
        } else {
            alert("Error on Param 2.Only text or value allowed -->" + checkAgaints);
        }
        var result = hayStack.includes(neddle);
        //console.log(neddle+" vs "+hayStack+" = "+result);//DEBUG
        //console.log("Selected return", result);//DEBUG
        return result;
    }).prop('selected', true);
}
});
0 голосов
/ 04 июня 2013

Над кодом работает, вы можете использовать следующий код: 

$("option[value='10']").attr('selected','selected');
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...