Javascript 在引导multiselect中使用onChange

我试图使用bootstrap multiselect通过jQuery

toggle（）

函数设置表中某些列的可见性。对于下拉列表中选择的每一列，我想根据选择与否显示或隐藏它。 但我显然不明白如何使用

onChange

事件来实现这一点。 有人能告诉我正确的语法吗

我的javascript和HTML如下所示：

  <script type="text/javascript">
    $(document).ready(function() {
        $('#showops').multiselect({
            maxHeight: 300,
            buttonWidth: '150px',
            includeSelectAllOption: true,
            allSelectedText: 'Showing All',
            onChange: function(element, checked) {
                if(checked == true){
                    if (element == '1') { $(".toggleG").toggle(); }
                    else if (element == '2') { $(".toggleE").toggle(); }
                }
            }
        });
    });
</script>

<select id="showops" multiple="multiple">
    <option value="1"> Show Grid </option>
    <option value="2"> Show eMail </option>
    <option value="3"> Show Lat/Lon </option>
    <option value="4"> Show Last Name </option>
    <option value="5"> Show TOD </option>
 </select>

$（文档）.ready（函数（）{
$（“#showops”）.multiselect({
最大高度：300，
按钮宽度：“150px”，
includeAlloption:true，
allSelectedText:“显示全部”，
onChange：函数（元素，选中）{
如果（选中==true）{
if（element='1'）{$（“.toggleG”）.toggle（）；}
else if（element='2'）{$（“.toggle”）.toggle（）；}
}
}
});
});
显示网格
显示电子邮件
显示纬度/经度
显示姓氏
显示TOD

我更改了

onChange

，如下所示。现在它启动了，但它只对第一个选择有效，而不是对每个选择有效

onChange: function(option, checked, select) {
    var opselected = $(option).val();
    if(checked == true) {
        if (opselected == '1') { $(".toggleG").toggle(); }
        if (opselected == '2') { $(".toggleE").toggle(); }
        if (opselected == '3') {
            $(".toggleLAT").toggle();
            $(".toggleLON").toggle();
        }
        if (opselected == '4') { $(".toggleLN").toggle(); }
        if (opselected == '5') { $(".toggleTOD").toggle(); } 
    } else if(checked == false)
        if (opselected == '1') { $(".toggleG").toggle(); }
        if (opselected == '2') { $(".toggleE").toggle(); }
        if (opselected == '3') {
            $(".toggleLAT").toggle();
            $(".toggleLON").toggle();
        }
        if (opselected == '4') { $(".toggleLN").toggle(); }
        if (opselected == '5') { $(".toggleTOD").toggle(); }
    }
}

这把它修好了

onChange: function(option, checked, select) {
            var opselected = $(option).val();
            if(checked == true) {

                  if (opselected == '1') { $(".toggleG").toggle(); } 
                  if (opselected == '2') { $(".toggleE").toggle(); } 
                  if (opselected == '3') { $(".toggleLAT").toggle(); $(".toggleLON").toggle();} 
                  if (opselected == '4') { $(".toggleLN").toggle(); } 
                  if (opselected == '5') { $(".toggleTOD").toggle(); } 
            } else if(checked == false) 
                  if (opselected == '1') { $(".toggleG").toggle(); } 
                  if (opselected == '2') { $(".toggleE").toggle(); } 
                  if (opselected == '3') { $(".toggleLAT").toggle(); $(".toggleLON").toggle();} 
                  if (opselected == '4') { $(".toggleLN").toggle(); } 
                  if (opselected == '5') { $(".toggleTOD").toggle(); }           
            }
        }

$（函数（）{
$（“#showops”）。更改（函数（）{
var selectedText=$（this）.find（“选项：selected”）.text（）；
var selectedValue=$（this.val（）；
警报（“选定文本：+selectedText+”值：+selectedValue”）；
});
});

是否触发“OnChange”事件？请更详细地描述您在尝试此操作时看到的内容。也许设置一个JSFIDLE来演示。据我所知，“OnChange”事件根本没有触发。我在里面放了一个警报，什么也没发生。我把“OnChange”改成这样。现在它启动了，但它只适用于第一个选择的选项，而不是每个选择的选项。OP询问的是有关引导Multiselect的问题。这确实解决了它。谢谢你。你错过了else if的一个开头的花括号

<script type="text/javascript">
    $(function () {
       $("#showops").change(function () {
        var selectedText = $(this).find("option:selected").text();
        var selectedValue = $(this).val();
        alert("Selected Text: " + selectedText + " Value: " + selectedValue);
    });
});
</script>