Подтвердить что ты не робот

JQuery: эффект mousedown (при нажатии левой кнопки мыши)

Мне нужна функция, которая выполняет функцию при нажатии кнопки и прекращает выполнение, когда кнопка отпускается

$('#button').--while being held down--(function() {
     //execute continuously
}); 
4b9b3361

Ответ 1

Я считаю, что что-то вроде этого будет работать:

var timeout, clicker = $('#clicker');

clicker.mousedown(function(){
    timeout = setInterval(function(){
        // Do something continuously 
    }, 500);

    return false;
});

$(document).mouseup(function(){
    clearInterval(timeout);
    return false;
});

См. эту демонстрацию: http://jsfiddle.net/8FmRd/

Ответ 2

Небольшая модификация исходного ответа:

$('#Clicker').mousedown(function () {
    //do something here
    timeout = setInterval(function () {
        //do same thing here again
    }, 500);

    return false;
});
$('#Clicker').mouseup(function () {
    clearInterval(timeout);
    return false;
});
$('#Clicker').mouseout(function () {
    clearInterval(timeout);
    return false;
});

С событием mouseout на кликере оно останавливается, когда вы перемещаете мышь из области щелчка.

Причина, по которой я предлагаю сделать то же самое дважды, - добиться более плавного эффекта. Если вы не сделаете это один раз до того, как будет установлен тайм-аут, это будет задержка, в данном случае, 500 мсек, прежде чем что-то произойдет.

Ответ 3

$.fn.click2=function(cb,interval){
   var timeout;
   if(!interval) interval=100;
   $(this).mousedown(function () { 
      var target=this;
       timeout = setInterval(function(){
          cb.apply(target);
       }, interval);

    return false;
   }).mouseup(function () {
      clearInterval(timeout);
      return false;
   }).mouseout(function () {
      clearInterval(timeout);
      return false;
   });
}

Ответ 4

Здесь реализована чистая реализация JavaScript для поставляемых решений, которая имеет расширенную поддержку сенсорных экранов. Вы подаете id, action для выполнения (function(){}) и interval (ms) для повторения action. Обратите внимание, что эта реализация также немедленно выполнит action, а не ждет, пока пропустит interval.

// Configures an element to execute a function periodically whilst it holds the user attention via a mouse press and hold.
function assertPeriodicPress(id, action, interval) {
  // Listen for the MouseDown event.
  document.getElementById(id).addEventListener('mousedown', function(ev) { action(); timeout = setInterval(action, interval); return false; }, false);
  // Listen for mouse up events.
  document.getElementById(id).addEventListener('mouseup', function(ev) { clearInterval(timeout); return false; }, false);
  // Listen out for touch end events.
  document.getElementById(id).addEventListener('touchend', function(ev) { clearInterval(timeout); return false; }, false);
}