jQuery chọn các phần tử tùy chọn theo giá trị

Question

Tôi có một phần tử chọn được bao quanh bởi một phần tử span. Tôi không được phép sử dụng id đã chọn nhưng tôi được phép sử dụng id span. Tôi đang cố gắng viết một hàm javascript/jquery trong đó đầu vào là một số i, là một trong các giá trị của các tùy chọn của lựa chọn. Hàm sẽ bật tùy chọn thích hợp để chọn.

<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> 

tôi đã viết một cái gì đó như sau (điều này không hoàn toàn hiệu quả, đó là lý do tôi đăng câu hỏi này):

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

} 

Cảm ơn!

Answer 1

Đây là giải pháp đơn giản nhất với một chọn rõ ràng:

function select_option(i) { 
    return $('span#span_id select option[value="' + i + '"]').html(); 
} 

Answer 2

Chỉ cần bọc tùy chọn của bạn bằng $ (tùy chọn) để làm cho nó hoạt động theo cách bạn muốn. Bạn cũng có thể làm cho đoạn code ngắn hơn bằng cách làm

$('#span_id > select > option[value="input your i here"]').attr("selected", "selected") 

Answer 3

options = $("#span_id>select>option[value='"+i+"']"); 
option = options.text(); 
alert(option); 

đây là fiddle http://jsfiddle.net/hRFYF/

Answer 4

function select_option(index) 
{ 
    var optwewant; 
    for (opts in $('#span_id').children('select')) 
    { 
     if (opts.value() = index) 
     { 
      optwewant = opts; 
      break; 
     } 
    } 
    alert (optwewant); 
} 

Answer 5

Để có được giá trị chỉ sử dụng:

<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> 

này sẽ lấy các giá trị

Answer 6

Với jQuery> 1.6.1 nên tốt hơn để sử dụng cú pháp sau:

$('#span_id select option[value="' + some_value + '"]').prop('selected', true); 

Answer 7

Bạn có thể sử dụng .val() để chọn giá trị, giống như sau:

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

đây là một jsfiddle: https://jsfiddle.net/tweissin/uscq42xh/8/