javascript - 通过下拉菜单进行多项选择

Question

波纹管是我的代码，我想要使用下拉菜单和复选框进行多项选择，当我在选择标记中使用多个属性时，会生成我不想要的 View 的列表类型，所以请帮助我我想要输出此网址 http://demo.itsolutionstuff.com/demo/demo-bootstrap-jquery-multiple-select-with-checkboxes-example-using-bootstrap-multiselectjs-pluginexample.html 中显示的内容但它在我的项目中不起作用，我正在使用 codeigniter 框架

<div class="col-md-4 col-sm-6">
    <div class="form-group">                            
        <label for="LS_name">Loan/Scholarship</label>
                        <?php 
                        $LSList = [];
                        if(isset($_REQUEST['LS_name'])){
                            $LSList = $_REQUEST['LS_name'];
                        }
                        ?>
                         <select class="form-control" name="LS_name[]" id="languages">
                            <?php foreach($LS_List as $key => $value){ ?>
                                <option value="<?php echo $value['name']; ?>" <?php if(in_array($value['name'], $LSList)){ ?>selected="selected"<?php } ?>><?php echo $value['name']; ?></option><?php
                            } ?>
                         </select>
                    </div>      
                </div>

我正在使用这个脚本

<script src="<?php echo base_url(); ?>assets/js/jquery-1.11.2.min.js">
  </script>
<script src="<?php echo base_url(); ?>assets/js/bootstrap-multiselect.js">
 </script>
<script src="<?php echo base_url(); ?>assets/js/bootstrap.min.js"></script>
 <script type="text/javascript">
 $(document).ready(function() {
    $('#languages').multiselect({
     includeSelectAllOption: true
    });
 });

Answer 1

我认为 multiselect.js Jquery 插件没有像您使用的那样提供 includeSelectAllOption 选项

这样做

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/multi-select/0.9.12/css/multi-select.min.css">
<a href='#' id='select-all'>select all</a>
<a href='#' id='deselect-all'>deselect all</a>
<select multiple="multiple" id="my-select" name="my-select[]">
      <option value='elem_1'>elem 1</option>
      <option value='elem_2'>elem 2</option>
      <option value='elem_3'>elem 3</option>
      <option value='elem_4'>elem 4</option>
      <option value='elem_100'>elem 100</option>
    </select>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/multi-select/0.9.12/js/jquery.multi-select.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#my-select').multiSelect();
        $('#select-all').click(function(){
          $('#my-select').multiSelect('select_all');
          return false;
        });
        $('#deselect-all').click(function(){
          $('#my-select').multiSelect('deselect_all');
          return false;
        });
    });

</script>

Demo在这里

希望对你有帮助