【问题标题】:Set other <select> value depending on first <select> [duplicate]根据第一个 <select> 设置其他 <select> 值 [重复]
【发布时间】:2017-02-03 19:36:20
【问题描述】:

我有两个 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 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>

【问题讨论】:

    标签: jquery select


    【解决方案1】:

    您可以使用 jQuery 的filter() 函数过滤掉第二个&lt;select&gt; 中的&lt;option&gt; 元素。以下内容将满足您的需求:

    $('#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

    【讨论】:

    • 谢谢!效果很好!
    猜你喜欢
    • 1970-01-01
    • 2014-08-23
    • 1970-01-01
    • 1970-01-01
    • 2022-12-17
    • 2014-10-11
    • 1970-01-01
    • 2012-12-06
    • 2019-12-30
    相关资源
    最近更新 更多