Ändern Sie den ausgewählten Wert einer Dropdown-Liste mit jQuery

Question

Ich habe eine Dropdown-Liste mit bekannten Werten. Ich versuche, die Dropdown-Liste auf einen bestimmten Wert einzustellen, von dem ich weiß, dass er existiert, indem ich jQuery . Regulär verwenden JavaScript würde ich so etwas tun wie:

ddl = document.getElementById("ID of element goes here");
ddl.value = 2; // 2 being the value I want to set it too.

Ich muss dies jedoch mit jQuery weil ich eine CSS Klasse für meinen Selektor (dumm ASP.NET Client-IDs...).

Hier sind ein paar Dinge, die ich ausprobiert habe:

$("._statusDDL").val(2); // Doesn't find 2 as a value.
$("._statusDDL").children("option").val(2) // Also failed.

Wie kann ich das tun mit jQuery ?

---

Update

Wie sich herausstellte, hatte ich beim ersten Mal alles richtig gemacht:

$("._statusDDL").val(2);

Wenn ich eine Warnung direkt darüber anbringe, funktioniert es gut, aber wenn ich die Warnung entferne und es mit voller Geschwindigkeit laufen lasse, erhalte ich den Fehler

Die ausgewählte Eigenschaft konnte nicht festgelegt werden. Ungültiger Index

Ich bin mir nicht sicher, ob es ein Fehler in jQuery ist oder Internet Explorer 6 (Ich vermute, dass das Internet Entdecker 6 ), aber es ist furchtbar ärgerlich.

Answer 1

In meinem Fall konnte ich es mit der Methode .attr() zum Laufen bringen.

$("._statusDDL").attr("selected", "");

Answer 2

Reines JS

Für moderne Browser Die Verwendung von CSS-Selektoren ist kein Problem für reine JS

document.querySelector('._statusDDL').value = 2;

function change() {
  document.querySelector('._statusDDL').value = 2;
}

<select class="_statusDDL">
  <option value="1" selected>A</option>
  <option value="2">B</option>
  <option value="3">C</option>
</select>

<button onclick="change()">Change</button>

Answer 3

Wenn wir von der Option Name und dann ausgewählte Optionen mit der jQuery finden wollen, sehen Sie bitte unten Code: -

<div class="control">
           <select name="country_id" id="country" class="required-entry" title="Country" data-validate="{'validate-select':true}" aria-required="true">
              <option value=""> </option>
              <option value="SA">Saudi Arabia</option>
              <option value="AF">Afghanistan</option>
              <option value="AR">Argentina</option>
              <option value="AM">Armenia</option>
              <option value="AW">Aruba</option>
              <option value="AU">Australia</option>
              <option value="AT">Austria</option>
              <option value="IS">Iceland</option>
              <option value="IN">India</option>
              <option value="ID">Indonesia</option>
              <option value="IR">Iran</option>
              <option value="IQ">Iraq</option>
              <option value="IE">Ireland</option>
              <option value="IM">Isle of Man</option>
              <option value="IL">Israel</option>
              <option value="IT">Italy</option>
              <option value="JM">Jamaica</option>
              <option value="JP">Japan</option>
              <option value="JE">Jersey</option>
              <option value="JO">Jordan</option>
              <option value="AE">United Arab Emirates</option>
              <option value="GB">United Kingdom</option>
              <option value="US" selected="selected">United States</option>
           </select>
        </div>
<script type='text/javascript'>
let countryRegion="India";
     jQuery("#country option:selected").removeAttr("selected");
        let cValue= jQuery("#country option:contains("+countryRegion+")").val();
        jQuery("#country option[value='"+cValue +"']").attr('selected', 'selected');
</script>

Ich hoffe, das wird helfen!