jQuery UI 정렬 방법이 너무 빨리 실행됩니다.

Question

사용자가 행과 테이블을 추가하고 행에서 행으로 테이블을 이동할 수있는 좌석 차트를 만들고 있습니다. 이미 그 기능을 추가했습니다. 그러나 사용자가 드래그를 시작할 때 함수를 실행하고 드래그를 중지 할 때 함수를 실행하는 것이 목표입니다. 지금은 시작 및 중지 메소드가 동시에 시작되고 사용자가 테이블을 드래그하기 훨씬 전에 시작됩니다. 모든 조언을 부탁드립니다.

//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"); 
    } 
});