2017-01-29 9 views
0

select2ボックスの2つのオプションがjqueryを使用して選択されていても失敗した場合、divショーを作成しようとしています。例えばSelect2複数の値とif/then

- 私の2つの選択肢は、第1および第2のとおりです。

<select id="choose1" multiple="multiple"> 
<option value="first">First</option> 
<option value="second">Second</option> 
</select> 

私は隠された2つのdivを持っている:divを表示するために

<div id="first"> 
ABC 
</div> 
<div id="second"> 
XYZ 
</div> 

$('#first').hide(); 
$('#second').hide(); 

そして今、私のjQueryを:

$('#choose1').select2(); 

$('#choose1').change(function() { 
    var val = $(this).val(); 
    var x = 'first'; 
    var y = 'second' 
    var z = ['first','second']; 

    if (val == x) { 
     $('#first').show(); 
    } 

    else if (val == y) { 
    $('#second').show(); 
    } 

    else if (val == z) { 
    $('#first').show(); 
    $('#second').show(); 
    } 

    }); 

どのように私はこれを動作させることができますか?

ありがとうございました。

答えて

1

あなたdivs

<div class="option-div" id="first">ABC</div> 
<div class="option-div" id="second">XYZ</div> 

にクラスを追加し、変更リスナーでこれを使用するために、あなたのJSを変更します。問題があるかもしれません

$('#choose1').change(function() { 
    $(".option-div").hide(); 
    $.each($(this).val(), function(i, v){ 
     $("#" + v).show(); 
    }); 
}); 

デモ

https://jsfiddle.net/Leankppt/

0

jQueryの読み込みで、jを配置する必要があります前のクエリselect2

ここで作業しているコードを参照してください:https://jsfiddle.net/L4tkx7rc/

関連する問題