Question

我正在创建一个座位表，用户可以在其中添加行和表，并将表从一行移到另一行。我已经添加了这个功能。但是，目标是在用户开始拖动时执行一个函数，在拖动停止时执行一个函数。现在，start和stop方法在用户开始拖动表之前同时启动。任何建议都表示赞赏。

//Global Vars
var tableCounter = 0;
var rowCounter = 0;
//////////////

$(".rowButton").click(function() {
  rowCounter++;
  $("#rowContainer").append("<div class='tableRow' id='row " + rowCounter + "'><a class='tableButton btn btn-primary'><span class='glyphicon glyphicon-plus'></span></a><ul class='sortable' ontouchstart='return false;' id='sortable" + rowCounter + "'></ul></div>");

$(".sortable").sortable({
  connectWith: ".sortable",
  start: console.log("start"),
  stop: console.log("stop")
});
$(".sortable").disableSelection();

$(".tableButton").unbind().click(function(){
  tableCounter++;                                                             
  $(this).next().append("<li ontouchstart='return false;' class='ui-state-default' id='"+ tableCounter + "'>Table " + tableCounter + "<br>" + "Test" + "</li>");
});

//Prevent touch selection of text 
$(".ui-state-default, .sortable").on("touchstart", function(e) {
  e.preventDefault();
});

});

链接到小提琴：http://jsbin.com/xilasun/edit?html,css,js,console,output

Answer 1

下面：

$(".sortable").sortable({
  connectWith: ".sortable",
  start: console.log("start"),
  stop: console.log("stop")
});

由于括号，您正在调用console.log()。您需要传递函数名称或匿名函数。相反，您要传递console.log()的结果，其返回值，即undefined。

它应该是这样的：

$(".sortable").sortable({
  connectWith: ".sortable",
  start: myStart,
  stop: myStop
});

function myStart() {}
function myStop() {}

或者这个：

$(".sortable").sortable({
  connectWith: ".sortable",
  start: function () {
      console.log("start");
  },
  stop: function () {
      console.log("start");
  }
});

jQuery UI可排序方法触发太快

1 个答案: