Question

我正在尝试选择表格中的多行（有限）。我现在可以从该选择中选择并接收数据，但是我想限制我的选择。我想创建一个表，用户只能选择6（有限）行。选择6行后，我要停止点击事件。

我这样尝试过，但由于无法停止事件而无法正常工作。

var selectedRows = 0;

if(selectedRows < 6) {
    $("#table1 tr").click( function(){
        if($(this).hasClass("selected")) console.log("already chosen");
        else {
            $(this).addClass("selected");
            var id = $("th",this).html();
            selectedRows++;
            console.log(selectedRows, teamNo);
        }
    });
} else {
    console.log("you've chosen 6 rows !");
}

编辑：我也想添加此功能。

如果用户选择6行，并且他/她继续选择更多行，则第一个选择将更改为第7个选择，依此类推。

Answer 1

尝试函数中的条件：

var selectedRows = 0;

$("#table1 tr").click( function(event){
  if($(this).hasClass("selected")) console.log("already chosen");
  else {
    if(selectedRows <= 6) {
      $(this).addClass("selected");
      var id = $("th",this).html();
      selectedRows++;
      console.log(selectedRows, teamNo);
    }
    else {
      console.log("you've chosen 6 rows !");
    }
  }
});

Answer 2

您需要检查用户是否在点击功能中选择了6个以上，然后在用户未选择6个时触发操作。

    $("#table1 tr").click( function(){
        if(selectedRows <= 6) {
            if($(this).hasClass("selected")) console.log("already chosen");
            else {
                $(this).addClass("selected");
                var id = $("th",this).html();
                selectedRows++;
                console.log(selectedRows, teamNo);
            }
        } else {
            console.log("you've chosen 6 rows !");
        }
    });

选择多行jQuery

2 个答案: