Question

我需要一些JS逻辑的帮助，因为我对它很陌生。我有2个单独的多选下拉复选框列表，用户可以选择。截至目前，他们每个人可以选择不超过5个。我怎么能把它设置在两个下拉的位置，只允许两个下载。

<select id="dropdown1" multiple="multiple" class="multiselect">
<select id="dropdown2" multiple="multiple" class="multiselect">

JS

$(document).ready(function() {
    $(".multiselect").multiselect({
    header: "Choose up to 5 areas",
    click: function(event,ui){
              if( $(this).multiselect("widget").find("input:checked").length > 5 ){
               return false;
          }},
      selectedList:5
    });

我假设我会使用id而不只是“.multiselect”类然后添加它们。 if语句中的#dropdown1+#dropdown2 > 5之类的东西。我只是不知道正确的语法，有人可以帮助我。

如果你不熟悉我正在使用的jQuery小部件：http://www.erichynds.com/blog/jquery-ui-multiselect-widget

按要求user689

$(document).ready(function() {
    $(".multiselect").multiselect({
    header: "Choose up to 5 areas",
    click: function(event,ui){
            if($(".multiselect").multiselect("getChecked").map(function(){
                return this.value;    
                }).size() > 5){ return false;}},
      selectedList:5
    });

Answer 1

使用方法的语法是：

$("#multiselect").multiselect("method_name");

例如，要获取所有单击复选框的数组：

var array_of_checked_values = $(".multiselect").multiselect("getChecked").map(function(){
return this.value;    
}).get();

在您的情况下，您只想获取复选框的数量，即数组的长度：

if($(".multiselect").multiselect("getChecked").map(function(){
return this.value;    
}).size() > 5){ return false;}

您使用的方法将自行访问每个复选框，这会使事情复杂化。

Answer 2

你可以这样做。

您将显示一条消息，并在数字大于5时取消选择该项目。

使用Jquery的Javascript

$(".multiselect option").click(function(){      
        if($(".multiselect").children(":checked").length > 5){
            if($(this).is(":checked")){
                $(this).removeAttr("selected");
                alert("You can select only 5 items");
            }
        }
    }
);

JS逻辑 - 添加2个多选复选框

2 个答案: