2

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

我为所有元素绑定mouseOver和单击事件，当我获得单击时，我删除了单击侦听器（这样它就不会干扰可调整大小的侦听器）。

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

怎么了 ？

东西就在这里。

http://parth.me/builderjs/index.html

主要部分是：

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

Esc键必然会取消选择任何选择。

4

1 回答 1

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

我所做的是，在调整大小开始后立即销毁上下文菜单，因此它不再监听 mouseclick 事件。并在调整大小事件结束时返回。

于 2012-03-02T23:48:22.930 回答