Question

我在解决这个小提琴时遇到了麻烦。当我提出限制时，我无法选择任何方框。有什么建议？？

我做了以下小提琴来展示这个例子。

  $(function() {
    $(".selectable").selectable({
 filter: "td.cs:lt(4)",

      stop: function(){
        var result = $("#select-result").empty();
        var result2 = $("#result2");
      $('.ui-selecting:gt(31)').removeClass("ui-selecting");

     $(".ui-selected", this).each(function(){

          var cabbage = this.id + ', ';
          result.append(cabbage);
        });

        var newInputResult = $('#select-result').text(); 
            newInputResult = newInputResult.substring(0, newInputResult.length - 1);
            result2.val(newInputResult); 
      }
    });
  });

由于

Answer 1

你想要达到什么目的？你在谈论哪些限制？如果您在lt(4)中使用filter，则要求selectable仅允许选择前4个框。

我修改了你的小提琴：http://jsfiddle.net/dw6Hf/40/，你会看到以下内容： -

     if($(".ui-selected").length>4)
          {
     $(".ui-selected", this).each(function(i,e){
         if(i>3)
         {
         $(this).removeClass("ui-selected");
         }
     });   
return;              
          }

现在最多可选择4个盒子..

更新：在被选中时不允许： - http://jsfiddle.net/dw6Hf/43/

selecting: function(i,e){
                    if($(".ui-selecting").length>4)
          {
     $(".ui-selecting", this).each(function(i,e){
         if(i>3)
         {
         $(this).removeClass("ui-selecting");
         }
     });   
return;              
          }     
        },

Answer 2

这是另一个解决方案，它不使用JqueryUI但可能是你想要的。它基本上切换了在单击框中选择的类，最多可以选择4。我将选择的课程添加到您的CSS

$(".cs").click(function(){
 var numItems = $('.selected').length   
if(numItems < 4) {          
     $(this).toggleClass("selected");   
}   

if(numItems == 4 && $(this).hasClass("selected")) {

    $(this).removeClass("selected"); 
}           

});

http://jsfiddle.net/NHnU5/1/

如何对表格进行可选限制

2 个答案: