有没有办法限制可以拖动的区域？

.draggable {
  pointer-events: none;
}

var draggableElement = document.getElementById('draggable');
var offsetX, offsetY;

draggableElement.addEventListener('mousedown', function(e) {
  offsetX = e.clientX - draggableElement.offsetLeft;
  offsetY = e.clientY - draggableElement.offsetTop;
});

document.addEventListener('mousemove', function(e) {
  if (offsetX && offsetY) {
    var newX = e.clientX - offsetX;
    var newY = e.clientY - offsetY;
    
    // 在这里可以添加限制拖动范围的逻辑
    // 例如：限制在某个父元素内拖动
    
    draggableElement.style.left = newX + 'px';
    draggableElement.style.top = newY + 'px';
  }
});

document.addEventListener('mouseup', function() {
  offsetX = null;
  offsetY = null;
});