2016-03-03 13 views
7

tôi đã đặt chức năng theo dõi sự kiện chuột trên document, mặc dù tôi chỉ cần chuột dành riêng cho mục đích phát hiện kích thước lại tại- ít nhất là ở thời điểm này ...Lấy phần tử DOM chuột hiện tại trong khi chỉnh sửa kích thước sự kiện jQuery-ui

var BoolMouseDown = false; 
var BoolResizing = false; 
document.body.onmousedown = function() { 
    BoolMouseDown = true; 
}; 
document.body.onmouseup = function() { 
    BoolMouseDown = false; 
}; 

trên ui

Sidenote: mục tiêu là để có được dữ liệu của tất cả các yếu tố dưới chuột để nó có thể biến đổi thành một (div) mới là một phần trong đó sống sót sau chinh phục

// called function on resiz event 

var ValueCurSourceCellId = ""; 
var ValueCurDestCellId = ""; 
function CurCellIdSet(val) { 
    if (BoolMouseDown) { 
     ValueCurDestCellId = val; 
     BoolMouseDown = false; 
    } 
    else { 
     if (BoolResizing) { 
      ValueCurDestCellId = val; 
     } 
     ValueCurSourceCellId = val; 
    } 
} 


var BoolHasCollided = false; 
$(gitem11) 
.mouseover(function() { 
    //cur mouse over = attribute of html-imput-hidden(curMoRszr="") 
    if (BoolMouseDown) return;//so if its Mouse Down - don't collect underlying element data 

    $elmHidData1.attr('curMoRszr', $(this).attr('id')); 
    CurCellIdSet($(this).attr('id')); 
}) 
.mousedown(function() { 
    BoolMouseDown = true; 
    $elmHidData1.attr('curMoRszr', $(this).attr('id')); 
    CurCellIdSet($(this).attr('id')); 
}) 
.mouseup(function() { 
    BoolMouseDown = false; 
    CurCellIdSet($(this).attr('id')); 
}) 
.resizable({ 

    handles: "e, s", ghost: true, 
    start: 
     // here 11 is the accident producer, 21 is the victim. 
     function() { 
      console.log("resize started"); 
      curg21initialpositionTop = $curg21.offset().top; 
      curg11initialpositionTop = $curg11.offset().top; 
      curg11initialHeight = $curg11.css("height").substring(0, 2); 
    }, 

    resize: 

     function (event, ui) { 

      var data1id = $elmHidData1.attr('curMoRszr'); 
      if (ui.size.height + curg11initialpositionTop > curg21initialpositionTop && ui.size.height + curg11initialpositionTop < curg21initialpositionTop + 50 + gap) 
      { 
       setRszble($curg11, $curg21); 
       BoolHasCollided = true; 
      } 

      $(gitem31).text("p: " + ui.size.height + "curg21initialuiposition:" + curg21initialuiposition + ", " + ui.position.top); 
     }, 
     stop: 
     // function to conclude the accident, give the new partial div a position and size 
}); 

khi hỏi ở đây trên SO, bài viết gần nhất tôi đã tìm thấy là This^

cách thích hợp để thu thập các dữ liệu về thay đổi kích thước tổ chức sự kiện là gì?

+1

Tôi sẽ sử dụng sự kiện 'resize': resize: function (e, ui) {var x = e.clientX; var y = e.clientY; } ' – Twisty

+0

@Twisty cảm ơn đề xuất của bạn, tôi sẽ thử nó .. – LoneXcoder

Trả lời

0

Trong javascript bạn có thể làm:

document.elementFromPoint(x, y);

trong đó x và y sẽ là vị trí chuột (tôi giả sử bạn có thể nhận được rằng vị trí con trỏ chính mình)

Từ đó bạn có thể nhận được dữ liệu tắt phần tử bạn cần.

Các vấn đề liên quan