jQuery:如何在单击按住释放操作后触发事件? [英] jquery: how do I trigger an event after a click-hold-release action?

问题描述

我想在单击，拖动和释放操作后显示菜单.

I want to show a menu after a click, drag, and release action.

如何使用jQuery触发它?

How do I trigger that with jQuery?

推荐答案

1. 收听有关mousedown事件的任何内容.
2. 向window
添加mousemove和mouseup事件处理程序
3. 在mouseup事件处理程序中，对任何您喜欢的元素调用trigger('yourcustomeventhere').另外，从window
中删除mouseup和mousemove事件处理程序.
4. ...?
5. 利润.

1. Listen for a mousedown event on whatever should be clicked on.
2. Add a mousemove and mouseup event handler to the window
3. In the mouseup event handler call trigger('yourcustomeventhere') on whatever element you please. Also, remove the mouseup and mousemove event handlers from window
4. ...?
5. profit.

jQuery是将为您执行此操作的库.我以为我对代码解释得足够好，但显然没有:

jQuery is the library that will do this for you. I thought I explained the code well enough, but apparantly not:

$(anElement).mousedown(foodown);

function foodown(){
  $(window).mousemove(foomove).mouseup(fooup);
  //stuff
}

function foomove(){
  //stuff
}

function fooup(){
  $(someElement).trigger('yourcustomevent');
  $(window).unbind('mousemove', foomove).unbind('mouseup', fooup);
}

---

/**
 * Dragondrop jQuery plugin by zzzzBov
 */
(function ($) {
  "use strict";
  var $window;

  function begin(e) {
    var event;
    $window.mousemove(drag).mouseup(end);
    event = $.Event('beginDragon');
    $(e.target).trigger(event);
    if (event.isDefaultPrevented()) {
      e.preventDefault();
    }
  }

  function drag(e) {
    var event;
    event = $.Event('dragDragon');
    $(e.target).trigger(event);
    if (event.isDefaultPrevented()) {
      e.preventDefault();
    }
  }

  function end(e) {
    var event;
    event = $.Event('endDragon');
    $(e.target).trigger(event);
    $window.unbind('mousemove', drag).unbind('mouseup', end);
    if (event.isDefaultPrevented()) {
      e.preventDefault();
    }
  }

  $.each('beginDragon dragDragon endDragon'.split(' '), function (i, name) {
    $.fn[name] = function(data,fn) {
      if (fn == null) {
        fn = data;
        data = null;
      }
      return arguments.length > 0 ?
        this.bind(name, data, fn) :
        this.trigger(name);
    };
  });

    $window = $(window);
    $window.mousedown(begin);
}(jQuery));

这篇关于jQuery:如何在单击按住释放操作后触发事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！