2010-08-03 2 views
15

Как контролировать только однократное срабатывание события?Запускать событие только один раз?

На самом деле, быстрый Google, кажется, намекают на то, что .one помогает ..

+2

Как только мой представитель возвращается за 3000 лет, я собираюсь hange 'elude' to 'allude' –

+0

О, это было, конечно, неловко. Спасибо за это. – Qcom

+0

Рад, что мой комментарий привлек его к вашему вниманию –

ответ

14

Вы можете использовать JQuery-х one method, который будет подписываться только первое вхождение события.
Например:

$('something').one('click', function(e) { 
    alert('You will only see this once.'); 
}); 
+0

Хорошо, удивительно, просто интересно, что такое «e» между вашими круглыми скобками? Кроме того, эта функция требует двух параметров? 1 за то, что вы хотите запускать только один раз, а другой для функции? – Qcom

+1

'e' - это формальный параметр события для обратного вызова. В этом случае он не используется. Эти два параметра - тип и функция события. –

+0

Удивительный! Это действительно полезно, какая разница между этим и .bind? Разве что это не нужно, чтобы быть несвязанным чем-то вроде .unbind? – Qcom

20

ваниль JS

function addEventListenerOnce(target, type, listener) { 
    target.addEventListener(type, function fn(event) { 
     target.removeEventListener(type, fn); 
     listener(event); 
    }); 
} 

addEventListenerOnce(document.getElementById("myelement"), "click", function (event) { 
    alert("You'll only see this once!"); 
}); 

http://www.sitepoint.com/create-one-time-events-javascript/

Edit: модификация вдохновлен версии лина и терминологии из https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

Edit 2016-11-23:

once подходит для браузеров. В настоящее время в Chrome 55, Firefox 50, Safari 10,1

И использовать его как это:

document.addEventListener(
    'DOMContentLoaded', 
    improveAllTheThings, 
    {once: true} 
); 

https://www.webreflection.co.uk/blog/2016/04/17/new-dom4-standards

3

То же ответ rofrol в , только другая форма:

function addEventListenerOnce(element, event, fn) { 
     var func = function() { 
      element.removeEventListener(event, func); 
      fn(); 
     }; 
     element.addEventListener(event, func); 
    } 
0

Кроме того, вы можете сделать это:

window.addEventListener("click", function handleClick(e) { 
    window.removeEventListener("click", handleClick); 

    // ... 
}); 
0

добавлены возможности для добавления/удаления слушателя событий:

function addEventListenerOnce(target, type, listener, optionsOrUseCaptureForAdd, optionsOrUseCaptureForRemove) { 
    const f = event => { 
     target.removeEventListener(type, f, optionsOrUseCaptureForRemove); 
     listener(event); 
    } 
    target.addEventListener(type, f, optionsOrUseCaptureForAdd); 
} 
2

Просто используйте правильную опцию в вашем методе addEventListener вызова:

element.addEventListener(event, func, { once: true }) 
+0

Не поддерживается IE. –

Смежные вопросы