2011-09-03 15 views
76

Tengo un elemento seleccionado envuelto por un elemento span. No estoy autorizado a usar la identificación de selección, pero puedo usar la identificación de span. Estoy tratando de escribir una función javascript/jquery en la cual la entrada es un número i, que es uno de los valores de las opciones de selección. La función cambiará la opción relevante a seleccionada.jQuery selecciona elementos de opción por valor

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

Yo he escrito de la siguiente manera (esto no funciona por completo, por lo que estoy publicando esta pregunta):

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

} 

Gracias!

Respuesta

124

Ésta es la solución más simple con un selector claro:

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

¡Gracias! Técnica maravillosa! – rapt

28

Simplemente ajuste su opción en $ (opción) para que actúe de la manera que desee. También puede hacer que el código más corto Haciendo

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

¡Gracias! ¡Definitivamente aprendí algo nuevo! – rapt

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

¡Gracias! No sé cuál es la implementación interna de jQuery, pero las otras soluciones parecen más simples. – rapt

+0

Si ya tiene jQuery, es más fácil, pero pensé que podría querer saber una forma pura de hacerlo. – Hogan

4

Para obtener el valor solo usa esto:

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

Esto obtendrá los valores

24

con jQuery> 1.6.1 debe ser mejor usar esta sintaxis:

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

Puede utilizar .val() para seleccionar el valor, al igual que el siguientes:

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

Aquí es una jsFiddle: https://jsfiddle.net/tweissin/uscq42xh/8/

+0

Fiddle no funciona – enkash

+0

Debería funcionar ahora, no estoy seguro de lo que sucedió. – tom

+0

¿En qué navegador/plataforma no funcionó? En Mac/Chrome, selecciona con éxito un elemento en la lista, que es exactamente lo que era la pregunta original. – tom

Cuestiones relacionadas