phát hiện khi mục đang được kéo sang trái hoặc phải với jQuery UI có thể kéo được?

Question

Tôi đang sử dụng giao diện người dùng JQuery để tạo thành phần tử có thể kéo và trong mã, người ta có thể chỉ định phải làm gì khi bắt đầu, kéo và kết thúc.

Nhưng làm cách nào tôi có thể chạy một hàm trên kéo sang trái và một chức năng khác khi kéo phải không?

Tôi đã giới hạn trục có thể kéo chỉ với trục x. Vì vậy, các yếu tố chỉ có thể di chuyển sang trái hoặc phải.

Answer 1

Kiểm tra này bản demo: http://jsfiddle.net/3NtS9/

Bạn có thể làm điều đó bằng cách kiểm tra chống lại các sự kiện trước đó phối hợp trên mỗi hoạt động kéo nguyên tử.

var prevX = -1; 

$('div').draggable({ 
    drag: function(e) { 
     //console.log(e.pageX); 
     if(prevX == -1) { 
      prevX = e.pageX;  
      return false; 
     } 
     // dragged left 
     if(prevX > e.pageX) { 
      console.log('dragged left'); 
     } 
     else if(prevX < e.pageX) { // dragged right 
      console.log('dragged right'); 
     } 
     prevX = e.pageX; 
    } 
}); 

Answer 2

tôi sẽ khuyên bạn xử lý các start và stop sự kiện và xác định vùng đồng bằng vị trí trong trường hợp ngừng để có được cho dù nó đã được chuyển sang trái hoặc phải:

http://jqueryui.com/draggable/#events

Answer 3

Dưới đây là một cách dễ dàng hơn để làm nó:

$("#draggable").draggable({ 
    drag: function(event, ui) { 
     $(this).text(ui.originalPosition.left > ui.position.left ? 'left' : 'right'); 
    } 
}); 

Demo: http://jsfiddle.net/GNHTW/