javascript - 表示された選択テキストを動的に変更する

Question

select 要素の選択されたインデックスを動的に変更したい。場合によっては、select のオプションによって、他の select のオプションが無効になることがあります。変更時に実行時にオプションを無効にすることはできますが、選択によって表示されるオプションを変更することはできません。

たとえば、これを選択した場合：

<select>
    <option>Even or Odd?</option>
    <option>Even</option>
    <option>Odd</option>
</select>

<select>
    <option value="">Pick a Number</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option
</select>

「奇数」を選択すると偶数は無効になりますが、最初の選択を「奇数」に変更したときにすでに偶数が選択されていた場合、2 番目の選択の選択インデックスが 0 であっても、表示される値はまだ元の値です。

私は現在試しました：

selects[i].selectedIndex = 0;
selects[i].value = "Pick a Number";
$(selects[i]).val("Pick a Number");
$(selects[i]).attrs("selectedIndex", 0);

ほとんどの場合、ページに表示される内容を実際に変更することなく、選択したインデックスが変更されるか、要素の値が空の文字列になります。