如何监听 jQuery 中的点击并按住？

javascript jquery events

2022-08-30 05:21:23

我希望能够在用户单击按钮时触发事件，然后将该单击次数按住 1000 到 1500 毫秒。

是否有jQuery核心功能或插件已经启用了此功能？

我应该自己滚吗？我应该从哪里开始？

答案 1

var timeoutId = 0;

$('#myElement').on('mousedown', function() {
    timeoutId = setTimeout(myFunction, 1000);
}).on('mouseup mouseleave', function() {
    clearTimeout(timeoutId);
});

编辑：根据AndyE进行更正...谢谢！

编辑 2：对每个 gnarf 具有相同处理程序的两个事件使用立即绑定

答案 2

空气编码（但在此小提琴上测试）)

(function($) {
    function startTrigger(e) {
        var $elem = $(this);
        $elem.data('mouseheld_timeout', setTimeout(function() {
            $elem.trigger('mouseheld');
        }, e.data));
    }

    function stopTrigger() {
        var $elem = $(this);
        clearTimeout($elem.data('mouseheld_timeout'));
    }


    var mouseheld = $.event.special.mouseheld = {
        setup: function(data) {
            // the first binding of a mouseheld event on an element will trigger this
            // lets bind our event handlers
            var $this = $(this);
            $this.bind('mousedown', +data || mouseheld.time, startTrigger);
            $this.bind('mouseleave mouseup', stopTrigger);
        },
        teardown: function() {
            var $this = $(this);
            $this.unbind('mousedown', startTrigger);
            $this.unbind('mouseleave mouseup', stopTrigger);
        },
        time: 750 // default to 750ms
    };
})(jQuery);

// usage
$("div").bind('mouseheld', function(e) {
    console.log('Held', e);
})