按住按钮javascript

Question

我的HTML5应用程序中的按钮出现问题。当我按下按钮时，视频播放器会运行并播放本地存储的视频。我现在的问题是，当我按住按钮并释放它时，它不会触发视频播放器。我正在按钮上使用Onclick事件。

我想要实现的是，如果我按住按钮然后释放它，它会触发与我使用onclick时相同的事件。我打算通过使用JavaScript来做到这一点，但我不知道如何解决这个问题。任何建议将非常感激。

提前致谢。

Answer 1

使用onmouseup事件。

var button = //your button

button.onmouseup = function() {
//your logic

}

Answer 2

实际上onmousedown事件而不是onClick将成功。

再次使用相同的语法：

使用Javascript

<button onmousedown ="clickFunction()">Click me!</button>

function clickFunction(){
//code goes here
}

jQuery的

function clickFunction(){
   $(button).onmousedown(function(){
       //code goes here
   });
};

Answer 3

你应该使用布尔值来保存当前状态。

var mouse_is_down = false;
var current_i = 0;              // current_i is used to handle double click (to not act like a hold)

var button = document.querySelector("#myButton");

button.onmousedown = function(){
    mouse_is_down = true;

    // Do thing here for a mousedown event

    setTimeout(
        (function(index){
            return function(){
                if(mouse_is_down && current_i === index){
                    //do thing when hold                        
                }
            };
        })(++current_i), 500); // time you want to hold before fire action in milliseconds
};

button.onmouseup = function(){
    mouse_is_down = false;
    current_i++;

    // Do thing here for a mouseup event
};

小提琴：link