Question

我正在制作一些交互式UI并使用jquery来调整大小和鼠标事件。

我绑定所有元素的mouseOver和click事件，当我得到一个点击时，我删除了点击监听器（这样它就不会与可调整大小的监听器相互干扰）。

这个工作正常，直到这里，现在可以调整所选元素的大小。开始调整大小工作正常，但是即使在mouseup之后，元素resize事件也没有结束，它仍然会用鼠标调整大小。

怎么了？

事情就在这里。

主要部分是：

var
  inspect = true,           // to disable inspect
  selected = null;          // currently selected event

function clickhandler(e) {
  console.log('click');
  if (selected != null)return;     // if some div is already selected, then return
  if (e.which == 3)return;         // if it was right click, return
  selected = $(e.target);          // selected = the element which received the click
  inspect = false;                 // disable inspection
  selected.addClass('selected');   // add SELECTED background + border
  $(window).unbind('click', clickhandler);  // remove the click listener
  $('.selected').resizable();               // make the selected element resizable
}

$(window).bind('click', clickhandler);    //bind the click event

＆＃39; Esc键＆＃39;键被绑定以取消选择任何选择。

Answer 1

contextMenu（正在侦听mouseclick事件）与resize end事件（它也想要mouseclick事件）相互干扰。解决方案：

  $('.selected').resizable({
    start:function () {
      $("*").destroyContextMenu();
      console.log('resize started');
    },
    stop:function () {

      $("*").contextMenu({
          menu:'myMenu'
        },
        function (action, el, pos) {
          console.log(el);
          eval(action + '(el)');
        });
      console.log('resize stopped');
    },
    resize:function () {
      console.log("resize happened");
    }
  });

我所做的是，一旦调整大小开始就破坏上下文菜单，因此它不再监听鼠标点击事件。并在调整大小事件结束时将其恢复。

jquery可调整大小的事件没有结束

1 个答案: