04.09.2014, 11:23
|
Интересующийся
|
|
Регистрация: 16.10.2013
Сообщений: 24
|
|
Обработка события внутри события
Какие есть способы в жс обработки события внутри обработчика другого события? Например мне нужно обработать движение мыши с зажатой кнопкой, есть ли какие-нибудь альтернативы кроме:
b.onmousedown = function()
{
b.onmousemove = function()
{
}
}
?
Как такое можно сделать через слушателя событий? Спасибо.
|
|
04.09.2014, 11:30
|
|
Тлен
|
|
Регистрация: 02.01.2010
Сообщений: 6,561
|
|
Чтоб не плодить для разных объектов лишних слушателей обычно делается так.
А так и приведённый вами подход для единичных случаев подходит, нет никаких сложностей в смене el.onfoo = bar на el.addEventListener('foo', bar, false) .
__________________
29375, 35
Последний раз редактировалось Aetae, 04.09.2014 в 12:37.
|
|
04.09.2014, 11:32
|
|
Профессор
|
|
Регистрация: 22.02.2012
Сообщений: 212
|
|
По человечески это пишеться так:
var mDown = false;
b.onmousedown = function(){ mDown = true; };
b.onmousemove = function(){if(mDown ){}};
b.mouseup = function(){ mDown = false; };
Можно сделать ещё хардкорней https://developer.mozilla.org/en-US/...eEventListener или используя jquery методы on off
|
|
04.09.2014, 12:07
|
Профессор
|
|
Регистрация: 11.02.2014
Сообщений: 303
|
|
Сообщение от Aetae
|
Чтоб не плодить для разных объектов лишних слушателей обычно делается так
|
Сообщение от Tek
|
По человечески это пишеться так:
var mDown = false;
b.onmousedown = function(){ mDown = true; };
b.onmousemove = function(){if(mDown ){}};
b.mouseup = function(){ mDown = false; };
|
Считаю, что это неправильный подход. Событие должно вешаться, когда его действительно нужно слушать и обрабатывать. ТС в данном плане мыслит правильно.
<button id="test">нажми меня, держи и таскай</button>
<span id="result"></span>
<script>
var button = document.getElementById('test'),
result = document.getElementById('result');
function mousemove(e) {
result.innerHTML = e.pageX + ', '+ e.pageY;
}
function mouseup() {
button.removeEventListener('mousemove', mousemove);
button.removeEventListener('mouseup', mouseup);
}
button.addEventListener('mousedown', function () {
button.addEventListener('mousemove', mousemove);
button.addEventListener('mouseup', mouseup);
});
</script>
|
|
04.09.2014, 12:13
|
Интересующийся
|
|
Регистрация: 16.10.2013
Сообщений: 24
|
|
Сообщение от Aetae
|
Чтоб не плодить для разных объектов лишних слушателей обычно делается так.
А так и привидётнный вами подход для единичных случаев подходит, нет никаких сложностей в смене el.onfoo = bar на el.addEventListener('foo', bar, false) .
|
Скажите, чем плохо создание новых слушателей? Они больше памяти едят? Я по Вашей ссылке не нашел ответа на вопрос, может плохо смотрел, но в целом разобрался, спасибо.
|
|
04.09.2014, 12:18
|
Интересующийся
|
|
Регистрация: 16.10.2013
Сообщений: 24
|
|
Сообщение от WorM32
|
Считаю, что это неправильный подход. Событие должно вешаться, когда его действительно нужно слушать и обрабатывать. ТС в данном плане мыслит правильно.
<button id="test">нажми меня, держи и таскай</button>
<span id="result"></span>
<script>
var button = document.getElementById('test'),
result = document.getElementById('result');
function mousemove(e) {
result.innerHTML = e.pageX + ', '+ e.pageY;
}
function mouseup() {
button.removeEventListener('mousemove', mousemove);
button.removeEventListener('mouseup', mouseup);
}
button.addEventListener('mousedown', function () {
button.addEventListener('mousemove', mousemove);
button.addEventListener('mouseup', mouseup);
});
</script>
|
Большое спасибо, это именно то, что я хотел увидеть.
|
|
04.09.2014, 12:34
|
|
Тлен
|
|
Регистрация: 02.01.2010
Сообщений: 6,561
|
|
grifangel, в обычном случае - ничем особым. Но например mousemove или там scroll вызываются многократно на каждое движение, и если будет много обработчиков висеть - могут возникнуть тормоза. Особенно на несвежем железе. Потому правилом хорошего тона - в рамках одного функционала использовать один подобный слушатель, один таймер итд. Само собой без фанатизма.
По поводу того - где использовать on, а где add я придерживаюсь следующего мнения: on следует использовать там где обработчик единственный и при этом элемент создан вами и никак не должен обрабатываться сторонним кодом. В остальных случаях - add.
Сообщение от WorM32
|
Сообщение от Aetae
|
Чтоб не плодить для разных объектов лишних слушателей обычно делается так.
|
Считаю, что это неправильный подход. Событие должно вешаться, когда его действительно нужно слушать и обрабатывать. ТС в данном плане мыслит правильно.
|
Сообщение от Aetae
|
А так и приведённый вами подход для единичных случаев подходит
|
В случае же когда объектов множество, неправилен как раз подход с кучей обработчиков.
__________________
29375, 35
Последний раз редактировалось Aetae, 04.09.2014 в 12:39.
|
|
|
|