jquery - jQueryを使用して、選択した要素をテキスト、インデックス、または値でドロップダウンに配置するにはどうすればよいですか？

Question

この構造のselect要素があります：

<div class="ddl">
    <select>
        <option selected value="select">Select</option>
        <option value="T">Toyota</option>
        <option value="P">Porsche</option>
        <option value="N">Nissan</option>
        <option value="V">Volkswagen</option>
    </select>
</div>

また、jQueryセレクターに渡すselect要素のIDはなく、divの親クラスのみです。

これらの要素のいずれかを、テキスト、インデックス、または値によって選択された要素として配置するにはどうすればよいですか？

Answer 1

セレクターを操作するには、さまざまな方法があります。

jQuery 1.6 以降を使用する場合:

テキスト:

$('.ddl option:contains("Porsche")').prop('selected', true);

索引別:

$('.ddl option:eq(1)').prop('selected', true);

値別:

$('.ddl option[value="T"]').prop('selected', true);

---

古いバージョンの場合:

テキスト:

$('.ddl option:contains("Porsche")').attr('selected', 'selected');

索引別:

$('.ddl option:eq(1)').attr('selected', 'selected');

値別:

$('.ddl option[value="T"]').attr('selected', 'selected');

Answer 2

$(".ddl select").attr("value","T");

Answer 3

$('.ddl>select') が機能するはずです。これはクラス ddl の div であり、'>' は jQuery にそのクラスの直接の子を見つけるように指示します。ただし、クラス ddl で複数の div に注意してください。

Answer 4

これを試して：

例 (値による選択):

$(".ddl select").val("T");

Answer 5

$(document).ready(function(){
$('div.ddl >select option:selected').text(); //for getting text
$('div.ddl >select option:selected').val(); //value
$('div.ddl >select option').each(function(){ //looping
alert($(this).val());
});

});