Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Не работает onclick (https://javascript.ru/forum/misc/73304-ne-rabotaet-onclick.html)

sortarray 05.04.2018 15:36

Цитата:

Сообщение от Nexus
Если вас не затруднит написать эти пару строк, продемонстрируйте их, пожалуйста.

<html>
<head>
<meta charset = "utf-8" />
<style>
</style>
</head>

<body>

<div id = "foo">click me</div>

<script>

foo.storage = []
foo.onclick = function(){var self = this; foo.storage.forEach(function(f){f.call(self)})}
with(foo){
 storage.push(function(){alert(this.innerHTML)})
 storage.push(function(){alert(this.id)})
 storage.push(function(){alert("fuck addEventListener")})
}

</script>

</body>
</html>

Цитата:

Сообщение от Nexus
Можете объяснить недостаток объявления обработчика этим методом?

Там их целая куча -- невозможность удаления без сохранения ссылок, отсутствие гибкости, тормоза и т.д

Dimasikylll 05.04.2018 15:44

Malleys, спасибо. Там оказывается клик считывался на дочернем элементе с абсолютным позиционированием.

Nexus 05.04.2018 15:49

sortarray, это вот ваше решение проблемы?
Прошу прощения, но каким образом ваш код избавит меня от затирания прошлого обработчика события на "левом" элементе?
Более того, если я не буду знать о вашем костыле и объявлю новый обработчик элементу #foo через свойство, то все ваши handler'ы нафиг поотваливаются.

Цитата:

Сообщение от sortarray
невозможность удаления без сохранения

Ну, ваш вариант тут тоже не блещет, мягко говоря.
Цитата:

Сообщение от sortarray
отсутствие гибкости

Можете пояснить?
Цитата:

Сообщение от sortarray
тормоза

Если левой ногой программировать, то тормозить будет любой код :)

sortarray 05.04.2018 15:55

Nexus,
Цитата:

Сообщение от Nexus
Прошу прощения, но каким образом ваш код избавит меня от затирания прошлого обработчика события на "левом" элементе?
Более того, если я не буду знать о вашем костыле и объявлю новый обработчик через свойство, то все ваши handler'ы нафиг поотваливаются.

Это какая-то непонятная для меня хрень. Тут все от рук зависит
Цитата:

Сообщение от Nexus
Ну, ваш вариант тут тоже не блещет, мягко говоря.

В моем можно удалять обычным способом, по индексу, сигнатуре функции и т.д
Никаких ограничений.
Цитата:

Сообщение от Nexus
Можете пояснить?

Там, опять же, тма тмущая. Например, можно шарить поведение между двумя объектами. Прозрачность, опять же.
Цитата:

Сообщение от Nexus
Если левой ногой программировать, то тормозить будет любой код

Но от нативных тормозов хороший код не избавит

Nexus 05.04.2018 16:06

Цитата:

Сообщение от sortarray
Это какая-то непонятная для меня хрень. Тут все от рук зависит

Что непонятного?
Вы в проекте все обработчики на 1 элемент вешаете или для каждого будете создавать отдельное хранилище и пушить в него хандлеры?
Ваше решение работоспособно до тех пор, пока я не захочу объявить обработчик через свойство, а не через ваш велосипед.
foo.storage = []
foo.onclick = function(){var self = this; foo.storage.forEach(function(f){f.call(self)})}
with(foo){
 storage.push(function(){alert(this.innerHTML)})
 storage.push(function(){alert(this.id)})
 storage.push(function(){alert("fuck addEventListener")})
}
foo.onclick=()=>{
alert(prompt('Угадайте сколько раз вылезет alert',0)==1);
};


Цитата:

Сообщение от sortarray
В моем можно удалять обычным способом, по индексу
Никаких ограничений.

В вашем случае точно также нужно хранить индекс записанного обработчика.
Цитата:

Сообщение от sortarray
сигнатуре функции

Пример можно?

Цитата:

Сообщение от sortarray
Но от нативных тормозов хороший код не избавит

Он их не допустит, имхо. Можете привести пример тормозящего addEventListener'а?

Nexus 05.04.2018 16:17

Не очень решение для нескольких элементов + страшно представить код для обработки второго события )
<html>
<head>
<meta charset = "utf-8" />
<style>
</style>
</head>

<body>

<div id = "foo">click me</div>
<div id = "bar">click me</div>

<script>

foo.storage = []
foo.onclick = function(){var self = this; foo.storage.forEach(function(f){f.call(self)})}
with(foo){
 storage.push(function(){alert(this.innerHTML)})
 storage.push(function(){alert(this.id)})
 storage.push(function(){alert("fuck addEventListener")})
}

bar.storage = []
bar.onclick = function(){var self = this; foo.storage.forEach(function(f){f.call(self)})}
with(bar){
 storage.push(function(){alert(this.innerHTML)})
 storage.push(function(){alert(this.id)})
 storage.push(function(){alert("fuck addEventListener")})
}

</script>

</body>
</html>

+ Вы начинали с того, что хвалили объявление обработчиков через свойство, однако один фиг от него ушли, ибо ваше решение его просто не поддерживает (писал выше).

sortarray 05.04.2018 16:23

Nexus,
Я полагаю этот спор пустым, мне не интересно что-то доказывать. Кто понимает, тот и без того понимает
Вообще, в программировании всегда действует принцип "явное лучше неявного".
Если даже реализовать addEventListener с тем же поведением, что нейтив, самостоятельно, это будет лучше хардкора

Nexus 05.04.2018 16:27

sortarray, отчего же пустым?
Если вы докажете свою точку зрения, то те "заблудшие души", что объявляют event listener'ы через метод "addEventListener" задумаются о эффективности такого подхода и, возможно, перейдут на использование вашего велосипеда.
В противном случае, я таки надеюсь, вы задумаетесь о эффективности уже вашего решения etc.

Nexus 05.04.2018 16:31

Цитата:

Сообщение от sortarray
Кто понимает, тот и без того понимает

Если есть тут другие понимающие, приведите, пожалуйста, пример кода, где будет показана неэффективности объявления обработчика через "addEventListener" в пользу предлагаемого уважаемым sortarray метода.

Nexus 05.04.2018 16:37

Цитата:

Сообщение от sortarray
Вообще, в программировании всегда действует принцип "явное лучше неявного".

document.querySelector('#id').storage.click.push(function(){});//Т.е. объявление обработчика события таким способом более "явное", чем строкой ниже?
document.querySelector('#id').addEventListener('click',function(){});

Цитата:

Сообщение от sortarray
Если даже реализовать addEventListener с тем же поведением, что нейтив, самостоятельно, это будет лучше хардкора

Голословное заявление.

Upd. https://jsfiddle.net/oL8z9r38/


Часовой пояс GMT +3, время: 11:54.