6

Chosen jqueryプラグインを使用していますが、 max_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"); });

コードにエラーはありますか？

そしてもう1つの質問：プラグインページの最初の例に表示される検索ボックスのように、リストに検索機能を追加するにはどうすればよいですか？

ありがとう。

4

1 に答える 1

12

chosen()メソッドを2 回呼び出すため、問題が発生します。

$(".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"); } );
});
于 2013-03-22T03:04:07.633 に答える