0

次のような選択ドロップダウンがあります。

<select multiple="" id="search_skills" name="search_skills[]">
    <option value="all">All</option>
    <option value="1">PHP</option>
    <option value="2">JAVA</option>
    <option value="3">.NET</option>
</select>

ユーザーが最初に「すべて」を選択すると、すべての値が選択されます。そのためのクリックイベントが必要です。これが私が試していることですが、うまくいきません。

$(function(){ 
  $("select[name='search_skills[]']").change(function() {            
    if ( $("select[name='search_skills[]']")[0].selectedIndex === 0 ) {
        var sel_val = $("#search_skills").val();
        alert(sel_val);
        if(sel_val == 'all'){
            $("#search_skills > option").prop("selected","selected");
        }
        else if(sel_val.indexOf('all') == '-1'){
            $("#search_skills > option").removeAttr("selected");
        }
        $('#search_skills').selectpicker('refresh');
     }
  });
}); 

助けてください。

4

3 に答える 3

0

jQueryプロップを使用する

$('#selectall').click(function() {
    $('option').prop('selected', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select multiple="" id="search_skills" name="search_skills[]">
    <option id="selectall" value="all">All</option>
    <option value="1">PHP</option>
    <option value="2">JAVA</option>
    <option value="3">.NET</option>
</select>

于 2015-05-05T08:13:38.020 に答える
0

関数で試すことができprop()ます:

$(document).on('click', '#search_skills option[value="all"]', function() {
  var that = $(this);
  var opt = $('#search_skills > option');
  if (!that.is('selected')) {
    opt.prop('selected', true);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select multiple="" id="search_skills" name="search_skills[]">
    <option value="all">All</option>
    <option value="1">PHP</option>
    <option value="2">JAVA</option>
    <option value="3">.NET</option>
</select>

于 2015-05-05T08:13:52.567 に答える
0

試してみてください -

$('#search_skills option:first').on('click', function() {
var that = $(this);
  var opt = $('#search_skills > option');
  if (!that.is('selected')) {
    opt.prop('selected', true);
  }
})

デモ

于 2015-05-05T08:19:42.747 に答える