Question

我有两个SELECT元素。两者都有相同的选项标题，但值不同。是否有设置第二个SELECT的选项。

第一个：

<select id="acf-field_5640df62a984a-0-field_5640dfaea984b" class="" name="acf[field_5640df62a984a][0][field_5640dfaea984b]" data-ui="0" data-ajax="0" data-multiple="0" data-placeholder="Select" data-allow_null="0">
  <option value="Albania">Albania</option>
  <option value="Andora">Andora</option>
  <option value="Austria">Austria</option>
  <option value="Belgia">Belgia</option>
  <option value="Białoruś">Białoruś</option>
  <option value="Bośnia i Hercegowina">Bośnia i Hercegowina</option>
  <option value="Bułgaria">Bułgaria</option>
  <option value="Chorwacja">Chorwacja</option>
  <option value="Czarnogóra">Czarnogóra</option>
  <option value="Czechy">Czechy</option>
  <option value="Dania">Dania</option>
  <option value="Estonia">Estonia</option>
  <option value="Finlandia">Finlandia</option>
  <option value="Francja">Francja</option>
  <option value="Grecja">Grecja</option>
  <option value="Hiszpania">Hiszpania</option>
  <option value="Holandia">Holandia</option>
  <option value="Irlandia">Irlandia</option>
  <option value="Islandia">Islandia</option>
  <option value="Kazachstan">Kazachstan</option>
  <option value="Liechtenstein">Liechtenstein</option>
  <option value="Litwa">Litwa</option>
  <option value="Luksemburg">Luksemburg</option>
  <option value="Łotwa">Łotwa</option>
  <option value="Macedonia">Macedonia</option>
  <option value="Malta">Malta</option>
  <option value="Mołdawia">Mołdawia</option>
  <option value="Monako">Monako</option>
  <option value="Niemcy">Niemcy</option>
  <option value="Norwegia">Norwegia</option>
  <option value="Polska" selected="selected" data-i="0">Polska</option>
  <option value="Portugalia">Portugalia</option>
  <option value="Rosja">Rosja</option>
  <option value="Rumunia">Rumunia</option>
  <option value="San Marino">San Marino</option>
  <option value="Serbia">Serbia</option>
  <option value="Słowacja">Słowacja</option>
  <option value="Słowenia">Słowenia</option>
  <option value="Szwajcaria">Szwajcaria</option>
  <option value="Szwecja">Szwecja</option>
  <option value="Turcja">Turcja</option>
  <option value="Ukraina">Ukraina</option>
  <option value="Watykan">Watykan</option>
  <option value="Węgry">Węgry</option>
  <option value="Wielka Brytania">Wielka Brytania</option>
  <option value="Włochy">Włochy</option>
</select>

第二个SELECT：

<select id="acf-field_5640df62a984a-0-field_566178fe9bb1c" class="" name="acf[field_5640df62a984a][0][field_566178fe9bb1c]" data-ui="0" data-ajax="0" data-multiple="0" data-placeholder="Select" data-allow_null="0">
  <option value="Albania">Albania</option>
  <option value="Andorra">Andora</option>
  <option value="Austria">Austria</option>
  <option value="Belarus">Białoruś</option>
  <option value="Belgium">Belgia</option>
  <option value="Bosnia and Herzegovina">Bośnia i Hercegowina</option>
  <option value="Bulgaria">Bułgaria</option>
  <option value="Croatia">Chorwacja</option>
  <option value="Czech Republic">Czechy</option>
  <option value="Denmark">Dania</option>
  <option value="Estonia">Estonia</option>
  <option value="Finland">Finlandia</option>
  <option value="France">Francja</option>
  <option value="Germany">Niemcy</option>
  <option value="Greece">Grecja</option>
  <option value="Hungary">Węgry</option>
  <option value="Iceland">Islandia</option>
  <option value="Ireland">Irlandia</option>
  <option value="Italy">Włochy</option>
  <option value="Kazakhstan">Kazachstan</option>
  <option value="Latvia">Łotwa</option>
  <option value="Liechtenstein">Liechtenstein</option>
  <option value="Lithuania">Litwa</option>
  <option value="Luxembourg">Luksemburg</option>
  <option value="Malta">Malta</option>
  <option value="Moldova">Mołdawia</option>
  <option value="Monaco">Monaco</option>
  <option value="Netherlands">Holandia</option>
  <option value="Norway">Norwegia</option>
  <option value="Poland" selected="selected" data-i="0">Polska</option>
  <option value="Portugal">Portugalia</option>
  <option value="Republic of Macedonia">Republic of Macedonia</option>
  <option value="Romania">Rumunia</option>
  <option value="Russia">Rosja</option>
  <option value="San Marino">San Marino</option>
  <option value="Serbia">Serbia</option>
  <option value="Slovakia">Słowacja</option>
  <option value="Slovenia">Słowenia</option>
  <option value="Spain">Hiszpania</option>
  <option value="Sweden: Szwecja">Sweden: Szwecja</option>
  <option value="Switzerland">Szwajcaria</option>
  <option value="Turkey">Turcja</option>
  <option value="Ukraine">Ukraina</option>
  <option value="United Kingdom">Wielka Brytania</option>
  <option value="Vatican City">Watykan</option>
</select>

Answer 1

您可以使用jQuery的filter()函数过滤掉第二个<option>中的<select>个元素。以下内容适合您的需求：

$('#acf-field_5640df62a984a-0-field_5640dfaea984b').on('change', function() {

    // Get the selected element:
    var $selected = $(this).find('option:selected');

    // Now find the matching one in the second <select>:
    $('#acf-field_5640df62a984a-0-field_566178fe9bb1c').find('option:selected').removeAttr('selected');
    $('#acf-field_5640df62a984a-0-field_566178fe9bb1c').find('option').filter(function() { return $(this).text() == $selected.text() }).attr('selected', true);

});

jsFiddle Demo

根据第一个</select>设置其他<select>值

1 个答案: