Si conoce el índice, el valor o el texto. también si no tiene una identificación para una referencia directa.

Esto , esto y esto son respuestas útiles.

Marcado de ejemplo

<div class="selDiv">
  <select class="opts">
    <option selected value="DEFAULT">Default</option>
    <option value="SEL1">Selection 1</option>
    <option value="SEL2">Selection 2</option>
  </select>
</div>

Un selector para obtener el elemento de opción medio por valor es

$('.selDiv option[value="SEL1"]')

Para un índice:

$('.selDiv option:eq(1)')

Para un texto conocido:

$('.selDiv option:contains("Selection 1")')

EDITAR : Como se comentó anteriormente, el OP podría haber estado después de cambiar el elemento seleccionado del menú desplegable. En la versión 1.6 y superior, se recomienda el método prop ():

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

En versiones anteriores:

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

EDIT2 : después del comentario de Ryan. Una coincidencia en "Selección 10" podría no ser deseada. No encontré ningún selector que coincida con el texto completo, pero funciona un filtro :

 $('.selDiv option')
    .filter(function(i, e) { return $(e).text() == "Selection 1"})

EDITAR3 : Tenga cuidado con, $(e).text()ya que puede contener una nueva línea que hace que la comparación falle. Esto sucede cuando las opciones están implícitamente cerradas (sin </option>etiqueta):

<select ...>
<option value="1">Selection 1
<option value="2">Selection 2
   :
</select>

Si simplemente utiliza e.textcualquier espacio en blanco adicional, como la nueva línea final, se eliminará, lo que hará que la comparación sea más sólida.

Ninguno de los métodos anteriores proporcionó la solución que necesitaba, así que pensé que proporcionaría lo que funcionó para mí.

$('#element option[value="no"]').attr("selected", "selected");

Puedes usar el val()método:

$('select').val('the_value');

Por valor, lo que funcionó para mí con jQuery 1.7 fue el siguiente código, intente esto:

$('#id option[value=theOptionValue]').prop('selected', 'selected').change();

Hay varias maneras de hacer esto, pero el enfoque más limpio se ha perdido entre las principales respuestas y un montón de argumentos val(). También algunos métodos cambiaron a partir de jQuery 1.6, por lo que esto necesita una actualización.

Para los siguientes ejemplos, asumiré que la variable $selectes un objeto jQuery que apunta a la <select>etiqueta deseada , por ejemplo, a través de lo siguiente:

var $select = $('.selDiv .opts');

Nota 1: use val () para las coincidencias de valor:

Para la coincidencia de valores, usar val()es mucho más simple que usar un selector de atributos: https://jsfiddle.net/yz7tu49b/6/

$select.val("SEL2");

La versión setter de .val()se implementa en las selectetiquetas configurando la selectedpropiedad de una coincidencia optioncon la misma value, por lo que funciona bien en todos los navegadores modernos.

Nota 2 - use prop ('selected', true):

Si desea establecer el estado seleccionado de una opción directamente, puede usar prop(no attr) con un booleanparámetro (en lugar del valor de texto selected):

por ejemplo, https://jsfiddle.net/yz7tu49b/

$option.prop('selected', true);  // Will add selected="selected" to the tag

Nota 3: permita valores desconocidos:

Si usa val()para seleccionar un <option>, pero el valor no coincide (puede suceder dependiendo de la fuente de los valores), entonces se selecciona "nada" y $select.val()volverá null.

Entonces, para el ejemplo que se muestra, y en aras de la robustez, podría usar algo como esto https://jsfiddle.net/1250Ldqn/ :

var $select = $('.selDiv .opts');
$select.val("SEL2");
if ($select.val() == null) {
  $select.val("DEFAULT");
}

Nota 4 - coincidencia exacta del texto:

Si desea hacer coincidir el texto exacto, puede usar una filterfunción con. por ejemplo, https://jsfiddle.net/yz7tu49b/2/ :

var $select = $('.selDiv .opts');
$select.children().filter(function(){
    return this.text == "Selection 2";
}).prop('selected', true);

aunque si tiene espacio en blanco adicional, puede agregar un recorte al cheque como en

    return $.trim(this.text) == "some value to match";

Nota 5 - coincidencia por índice

Si desea hacer coincidir por índice, simplemente indexe los elementos secundarios de la selección, por ejemplo, https://jsfiddle.net/yz7tu49b/3/

var $select = $('.selDiv .opts');
var index = 2;
$select.children()[index].selected = true;

Aunque tiendo a evitar las propiedades DOM directas a favor de jQuery hoy en día, a un código a prueba de futuro, eso también podría hacerse como https://jsfiddle.net/yz7tu49b/5/ :

var $select = $('.selDiv .opts');
var index = 2;
$select.children().eq(index).prop('selected', true);

Nota 6: use change () para activar la nueva selección

En todos los casos anteriores, el evento de cambio no se dispara. Esto es por diseño para que no termines con eventos de cambio recursivo.

Para generar el evento de cambio, si es necesario, simplemente agregue una llamada al objeto .change()jQuery select. Por ejemplo, el primer ejemplo más simple se convierte en https://jsfiddle.net/yz7tu49b/7/

var $select = $('.selDiv .opts');
$select.val("SEL2").change();

También hay muchas otras formas de encontrar los elementos utilizando selectores de atributos, como [value="SEL2"], pero debe recordar que los selectores de atributos son relativamente lentos en comparación con todas estas otras opciones.

Puede nombrar la selección y usar esto:

$("select[name='theNameYouChose']").find("option[value='theValueYouWantSelected']").attr("selected",true);

Debe seleccionar la opción que desee.

   $(elem).find('option[value="' + value + '"]').attr("selected", "selected");

Respondiendo mi propia pregunta para documentación. Estoy seguro de que hay otras formas de lograr esto, pero esto funciona y este código se prueba.

<html>
<head>
<script language="Javascript" src="javascript/jquery-1.2.6.min.js"></script>
<script type="text/JavaScript">

$(function() {
    $(".update").bind("click",      // bind the click event to a div
        function() {
            var selectOption = $('.selDiv').children('.opts') ;
            var _this = $(this).next().children(".opts") ;

            $(selectOption).find("option[index='0']").attr("selected","selected");
//          $(selectOption).find("option[value='DEFAULT']").attr("selected","selected");
//          $(selectOption).find("option[text='Default']").attr("selected","selected");


//          $(_this).find("option[value='DEFAULT']").attr("selected","selected");
//          $(_this).find("option[text='Default']").attr("selected","selected");
//          $(_this).find("option[index='0']").attr("selected","selected");

    }); // END Bind
}); // End eventlistener

</script>
</head>
<body>
<div class="update" style="height:50px; color:blue; cursor:pointer;">Update</div>
<div class="selDiv">
        <select class="opts">
            <option selected value="DEFAULT">Default</option>
            <option value="SEL1">Selection 1</option>
            <option value="SEL2">Selection 2</option>
        </select>
    </div>
</body>
</html>

Exactamente funcionará, pruebe estos métodos a continuación

Para la opción de selección normal

<script>    
    $(document).ready(function() {
    $("#id").val('select value here');
       });
        </script>

Para seleccionar 2 opción, la opción de disparo necesita usar

<script>    
        $(document).ready(function() {
        $("#id").val('select value here').trigger('change');
           });
            </script>

Usando jquery-2.1.4 , encontré que la siguiente respuesta funcionaba para mí:

$('#MySelectionBox').val(123).change();

Si tiene un valor de cadena, intente lo siguiente:

$('#MySelectionBox').val("extra thing").change();

Otros ejemplos no funcionaron para mí, por eso agrego esta respuesta.

Encontré la respuesta original en: https://forum.jquery.com/topic/how-to-dynamically-select-option-in-dropdown-menu

Para configurar el valor de selección con la activación seleccionada:

$('select.opts').val('SEL1').change();

Para configurar la opción desde un ámbito:

$('.selDiv option[value="SEL1"]')
    .attr('selected', 'selected')
    .change();

Este código usa el selector para encontrar el objeto seleccionado con condición, luego cambia el atributo seleccionado por attr().

Además, recomiendo agregar un change()evento después de configurar el atributo selected, al hacer esto, el código se cerrará para cambiar la selección por usuario.

Lo uso cuando conozco el índice de la lista.

$("#yourlist :nth(1)").prop("selected","selected").change();

Esto permite que la lista cambie y active el evento de cambio. El ": nth (n)" cuenta desde el índice 0

Iré con: -

$("select#my-select option") .each(function() { this.selected = (this.text == myVal); });

Prueba esto

solo usa select field id en lugar de #id (es decir, # select_name)

en lugar del valor de la opción, use su valor de opción de selección

 <script>
    $(document).ready(function() {
$("#id option[value='option value']").attr('selected',true);
   });
    </script>

Para Jquery elegido si envía el atributo a la función y necesita actualizar la opción de selección

$('#yourElement option[value="'+yourValue+'"]').attr('selected', 'selected');
$('#editLocationCity').chosen().change();
$('#editLocationCity').trigger('liszt:updated');

/* This will reset your select box with "-- Please Select --"   */ 
    <script>
    $(document).ready(function() {
        $("#gate option[value='']").prop('selected', true);
    });
    </script>

Se $('select').val('the_value');ve la solución correcta y si tiene filas de tabla de datos, entonces:

$row.find('#component').val('All');

si no desea usar jQuery, puede usar el siguiente código:

document.getElementById("mySelect").selectedIndex = "2";

Gracias por la pregunta Espero que este código funcione para ti.

var val = $("select.opts:visible option:selected ").val();

$('#select option[data-id-estado="3"]').prop("selected",true).trigger("change");

o

$('#select option[value="myValue"]').prop("selected",true).trigger("change");