Lo puedes hacer simplemente mediante el método val()
. Según la doc:
val()
allows you to pass an array of element values. This is useful
when working on a jQuery object containing elements like <input type="checkbox">
, <input type="radio">
, and <option>
s inside of a
<select>
. In this case, the inputs and the options having a value
that matches one of the elements of the array will be checked or
selected while those having a value that doesn't match one of the
elements of the array will be unchecked or unselected, depending on
the type. In the case of <input type="radio">
s that are part of a
radio group and <select>
s, any previously selected element will be
deselected.
val()
le permite pasar una matriz de valores de elementos. Esto es
útil cuando se trabaja en un objeto jQuery que contiene elementos como
<input type = "checkbox">
, <input type = "radio">
y <option>
s
dentro de un <select>
. En este caso, las entradas y las opciones que
tengan un valor que coincida con uno de los elementos de la matriz se
verificarán o seleccionarán, mientras que las que tengan un valor que
no coincida con uno de los elementos de la matriz se desmarcarán o no
se seleccionarán, según en el tipo. En el caso de <input type =
"radio">
s que son parte de un grupo de radio y <select>
s,
cualquier elemento previamente seleccionado será deseleccionado.
Aquí, se seleccionarán por defecto aquellos option
que tengan los valores 3
y 4
. Se trata de pasar a val()
un array con aquellos valores que quieres seleccionar y... listo.
Y, evita usar $(document).ready...
, es obsoleto desde jQuery 3, se recomienda usar $(function() {
.
//$(document).ready(function() es obsoleto desde jQuery 3
$(function() {
$("#alergia2").val([3,4]);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="alergias2[]" multiple="multiple" id="alergia2">
<optgroup label="Alergias">
<option value="3">Celíaca</option>
<option value="2">Celíaca sin Lactosa</option>
<option value="4">Diabética</option>
<option value="5">Normal o Basal</option>
</optgroup>
</select>
Como dice la doc, val()
tiene la ventaja además de que deseleccionaría cualquier opción previa que esté seleccionada, en caso de no encontrarse en el array. Por ejemplo aquí, la opción 2
estaría seleccionada por defecto, pero cuando le pasamos a val
el array [3,4]
la opción 2
se deselecciona.
//$(document).ready(function() es obsoleto desde jQuery 3
$(function() {
$("#alergia2").val([3,4]);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="alergias2[]" multiple="multiple" id="alergia2">
<optgroup label="Alergias">
<option value="3">Celíaca</option>
<option value="2" selected>Celíaca sin Lactosa</option>
<option value="4">Diabética</option>
<option value="5">Normal o Basal</option>
</optgroup>
</select>
>
del selector (ya que eloption
no es el siguiente nivel si no optgroup). También podrías hacer algo así: ` $("#alergia2").val(["3","4"]);`