2016-09-26 43 views
-2

我有兩個SELECT元素。 兩者都具有相同的選項標題,但具有不同的值。 是否有設置第二個SELECT的選項。設置其他<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> 

回答

0

您可以使用jQuery的filter()功能在第二<select>過濾掉<option>元素。下面將爲您的工作需要:

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

+0

的感謝!它運作良好! –

相關問題