【问题标题】:Chosen plugin max_selected_options选择的插件 max_selected_options
【发布时间】:2013-03-13 10:35:15
【问题描述】:

我使用Chosen jquery 插件,我注意到 ma​​x_selected_options 不起作用:

代码是这样的:

<!doctype html> 
<html lang="en"> 
<head>
    <link rel="stylesheet" href="chosen/chosen.css" />
</head>
<body>

<select id="assets" data-placeholder="Choose assets" class="chzn-select" multiple style="width:350px;" tabindex="4">
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
    <option value="d">d</option>
    <option value="e">e</option>
    <option value="f">f</option>
    <option value="g">g</option>
</select>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="chosen/chosen.jquery.js" type="text/javascript"></script>
<script type="text/javascript"> 


    $(document).ready(function(){
        $(".chzn-select").chosen();
        $(".chzn-select-deselect").chosen({allow_single_deselect:true});
        $('.chzn-select').chosen({ max_selected_options: 3 });
        $(".chzn-select").bind("liszt:maxselected", function () { alert("a"); });
        $(".chzn-select").chosen().change( function () { alert("a"); } );
    });

</script>
</body>
</html>

我不明白我的代码有什么不正确之处。这一行:

$('.chzn-select').chosen({ max_selected_options: 3 });

应该限制允许选择的最大数量。但它不起作用。我仍然可以选择任意数量的项目。 我注意到,在达到所选项目的最大数量的情况下应该触发的事件也不会触发:

$(".chzn-select").bind("liszt:maxselected", function () { alert("a"); });

我的代码有错误吗?

还有一个问题:如何将搜索功能添加到我的列表中,例如插件页面上第一个示例中出现的搜索框?

谢谢。

【问题讨论】:

    标签: jquery-plugins jquery-chosen


    【解决方案1】:

    您调用了两次chosen() 方法,这就是您遇到问题的原因:

    $(".chzn-select").chosen();
    $('.chzn-select').chosen({ max_selected_options: 3 });
    

    删除第一个即可。你的 JS 代码应该是:

    $(document).ready(function(){
        $(".chzn-select-deselect").chosen({allow_single_deselect:true});
        $(".chzn-select").chosen({ max_selected_options: 3 });
        $(".chzn-select").bind("chosen:maxselected", function () { alert("max elements selected"); });
        $(".chzn-select").chosen().change( function () { alert("change"); } );
    });
    

    【讨论】:

    • 如果我们需要改变后者的 max_selected_options 怎么办?根据您的解释,这意味着它不起作用
    • @CharlesOkwuagwu chosenplugin 似乎无法在初始化后更改设置,所以我认为唯一的选择是销毁插件并重新初始化它:$(".chzn-select").chosen("destroy"); 然后@987654326 @
    猜你喜欢
    • 2023-03-23
    • 1970-01-01
    • 2012-08-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-07-16
    • 2012-02-17
    • 2013-04-20
    相关资源
    最近更新 更多