Select2 несколько значений, и если/then

Question

Я пытаюсь получить div-шоу, если в jquery выбрано 2 варианта в поле select2, но не увенчались успехом.

Например - мой 2 вариантом является первыми и вторым:

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

У меня 2 див, которые скрыты:

<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(); 
    } 

    }); 

Любые идеи о том, как я могу заставить это работать?

Спасибо.

Answer 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/

Answer 2

Там может быть проблема с загрузкой jQuery вам нужно поставить j Запрос до select2

Просмотреть действующий код: https://jsfiddle.net/L4tkx7rc/