Правильная установка кода на событие onclick

@katjuha6 · Регистрация: 17.01.2013

Студворк — интернет-сервис помощи студентам

Всем добрый день, уважаемые форумчане!
На сайте стоит оформление заказа в один клик.
Оптимизатор дал задание поставить код отслеживая на кнопку.
исходный код

HTML5
1
<span class="btn btn-inverse" onclick="quickOrder.openForm(this)">Купить в один клик</span>

то, что нужно добавить

HTML5
1
onclick="gtag('event', 'clickquickorder', { 'event_category': 'quickorder', 'event_action': 'click', });"

и вторая кнопка

HTML5
1
<input type="submit" class="button" value="Отправить" onclick="return quickOrder.submitForm()">

добавить

HTML5
1
onclick="gtag('event', 'quickorderissued', { 'event_category': 'fastcheckout', 'event_action': 'click', });"

подскажите, пожалуйста, как поставить этот код, чтобы не поломать все? просто я не уверена в том, что на один "onclick" можно навешивать 2 разных события. или можно?

@netBool · 25.12.2017, 17:10

katjuha6,

JavaScript
1
2
3
4
5
6
7
<script>
function myevent(elem)
{
     quickOrder.openForm(elem);
     gtag('event', 'clickquickorder', { 'event_category': 'quickorder', 'event_action': 'click', });
}
</script>

HTML5
1
<span class="btn btn-inverse" onclick="myevent(this)">Купить в один клик</span>

@kalabuni · 25.12.2017, 18:59

Сообщение от katjuha6

я не уверена в том, что на один "onclick" можно навешивать 2 разных события. или можно?

выражаться изволите очень и очень неграмотно:

onclick -- это и есть событие
"навешивать" на одно событие можно не только два, но хоть миллион разных действий / функций
и каждой из "навешиваемых" функций можно передать ЛЮБОЕ количество параметров
проверьте:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<style>
li {margin-bottom: 12px; text-decoration: underline; cursor: pointer}
</style>
<script>
function func3 () {alert (3);}
function func4 () {alert (4);}
function funcMulti (a, b, c, d) {alert ([a, b, c, d].join (' - '));}
</script>
<ul>
<li onclick = "alert (1); alert (2);">когда кликнешь здесь, увидишь последовательно два окошка 1 и 2</li>
 
<li onclick = "func3 (); func4 ();">а кликнешь здесь, то тоже увидишь последовательно два окошка 3 и 4</li>
<li onclick = "funcMulti (1, 2, 3, 4);">если же кликнешь здесь,  то увидишь одно длинное окошко 1 - 2 - 3 - 4</li>
</ul>

@Lazy_Den · 25.12.2017, 19:59

Сообщение от kalabuni

onclick -- это и есть событие

Поправочка: событие - click, а onclick - это или же атрибут, или же свойство, в зависимости от способа установки обработчика события.

@kalabuni · 25.12.2017, 20:16

Сообщение от Lazy_Den

Поправочка: событие - click, а onclick - это или же атрибут, или же свойство, в зависимости от способа установки обработчика события.

мелкомягкие с вами поспорят -- см. их документацию, которая так и называется "Событие onclick" ("onclick event" в оригинале)

а атрибут это, свойство или что-то иное -- это, по мелкомягким, всего лишь нюансы синтаксиса

И, кстати, лично я полагаю это абсолютно правильным

@Lazy_Den · 25.12.2017, 20:23

Сообщение от kalabuni

см. доки onclick event

Я тоже инфу читаю не на левых ресурсах. Например, по этой ссылке, читаем первое же предложение:

The onclick property returns the click event handler code on the current element.

HTML-теги могут содержать в себе только атрибуты. Даже checked, selected и т.д., которые по сути являются свойствами, всё равно в рамках HTML-синтаксиса считаются атрибутами. Или, говоря уже о JS, синтаксис кода element.onclick - безоговорочно говорит нам о том, что обращаемся мы к свойству, а не событию. И, лично я, считаю уже это абсолютно правильным.

@kalabuni · 25.12.2017, 20:30

не соглашусь
мозилловские "примочки" типа Window и Document (именно так, с заглавной буквы) вместо нормальных объектов window и document абсолютно ничего не добавляют к картине мира, а лишь излишне усложняют её

Вопрос: чем мозилловский объект GlobalEventHandlers по сути отличается от нормального объекта object?
ответ: принципиально ничем не отличается

Берем бритву Оккама (надеюсь, слышали про такой инструмент, и знаете, для чего он предназначен) и отсекаем ею излишнее усложнение

@Lazy_Den · 25.12.2017, 20:36

Сообщение от kalabuni

мозилловские "примочки"

Хорошо, пусть будут не мозиловские. Возьмём документацию W3C. Заголовок над списком того, что вы называете событиями, а я атрибутами или свойствами, звучит так: "Attribute definitions".

Добавлено через 1 минуту

Сообщение от kalabuni

отсекаем ею излишнее усложнение

Я не про усложнение, а про обычную терминологию. Хотя, как я понимаю, мы всё равно останемся при своих мнениях.

@kalabuni · 25.12.2017, 21:07

Сообщение от Lazy_Den

Я не про усложнение, а про обычную терминологию.Хотя, как я понимаю, мы всё равно останемся при своих мнениях.

увы,
на данный момент в этом вопросе (про "события") существуют две терминологии, знать (и понимать) надо обе
а о вкусах, действительно, лучше не спорить

возвращаясь к вчерашней теме про конъюнкцию, и, пользуясь вашими наработками:

JavaScript
1
 if ((W3C === MDN) && (MDN != MSDN)) {alert ('и куда бедному программисту податься?!');}

@Lazy_Den · 25.12.2017, 21:20

kalabuni, да, уже не первый раз сталкиваюсь с тем, что мы (рядовые программисты) становимся заложниками разных интерпретаций понятий тех, к кому стараемся прислушиваться и следовать их рекомендациям.

@kalabuni · 25.12.2017, 21:38

Lazy_Den, кстати, мой пример с алертами выше отказывается работать в jsfiddle, алерты появляются только после первого клика, после второго и далее - страница никак не реагирует

@Lazy_Den · 25.12.2017, 22:20

Сообщение от kalabuni

мой пример с алертами выше отказывается работать в jsfiddle

Не заметил такого бага

@kalabuni · 26.12.2017, 00:04

Сообщение от Lazy_Den

Не заметил такого бага

спасибо, действительно, работает

Добавлено через 5 минут

Сообщение от Lazy_Den

Возьмём документацию W3C. Заголовок над списком того, что вы называете событиями, а я атрибутами или свойствами, звучит так: "Attribute definitions".

признайтесь, что сжульничали маленько -- раздел, где вы нашли заголовок списка "Attribute definitions", называется 18.2.3 Intrinsic events, что переводится как "Внутренние события", об чём и был спич -- то есть все эти onload, onclick, и далее по списку -- это всё же события, которые в html-коде только лишь "выглядят", как атрибуты

@Lazy_Den · 26.12.2017, 02:41

Думал, что тему порехали...

Сообщение от kalabuni

признайтесь, что сжульничали маленько

Даже в мыслях такого не было.
Не буду говорить о других, но для себя лично, я четко распределяю обсуждаемые понятия. Фразу "внутренние события", я понимаю по своему, но никому не хочу навязывать свою точку зрения, т.к. пока она не имеет под собой твердого обоснования. Да, исходя из заголовка в документации, можно воспринимать атрибуты on<event>, как внутренние события, но всё-таки это атрибуты, о чем, собственно, там неоднократно пишется. Если говорить именно о событиях, то есть отдельный раздел W3C, посвященный им - Event Types, полистав который, мы не обнаружим никаких событий с приставкой on. За исключением, например, части Mouse Events, где написано буквально следующее:

The mouse event module originates from the [HTML40] onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, and onmouseout attributes.

Как видим, эти ключевые слова, опять же определятся, как атрибуты.

В конце концов, фиг с ними и пусть каждый называет, как его душе угодно. Главное, что установка обработчиков событий inline, с каждым днём уходит в прошлое, но это уже совсем другая история, достойная нового холивара

Новые блоги и статьи Все статьи Все блоги /
Знаешь почему 90% людей редко бывают счастливыми? kumehtar 14.04.2026 Потому что они ждут. Ждут выходных, ждут отпуска, ждут удачного момента. . . а удачный момент так и не приходит.	Фиксация колонок в отчете СКД Maks 14.04.2026 Фиксация колонок в СКД отчета типа Таблица. Задача: зафиксировать три левых колонки в отчете. Процедура ПриКомпоновкеРезультата(ДокументРезультат, ДанныеРасшифровки, СтандартнаяОбработка) / / . . .	Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .
Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .	Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача №1: при указании работ (справочник РаботыПоРемонтуСпецтехники),. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	25.12.2017, 20:30
	не соглашусь мозилловские "примочки" типа Window и Document (именно так, с заглавной буквы) вместо нормальных объектов window и document абсолютно ничего не добавляют к картине мира, а лишь излишне усложняют её Вопрос: чем мозилловский объект GlobalEventHandlers по сути отличается от нормального объекта object? ответ: принципиально ничем не отличается Берем бритву Оккама (надеюсь, слышали про такой инструмент, и знаете, для чего он предназначен) и отсекаем ею излишнее усложнение 0

@Lazy_Den 3325 / 2845 / 1423 Регистрация: 15.01.2014 Сообщений: 6,170
	25.12.2017, 21:20
	kalabuni, да, уже не первый раз сталкиваюсь с тем, что мы (рядовые программисты) становимся заложниками разных интерпретаций понятий тех, к кому стараемся прислушиваться и следовать их рекомендациям. 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	25.12.2017, 21:38
	Lazy_Den, кстати, мой пример с алертами выше отказывается работать в jsfiddle, алерты появляются только после первого клика, после второго и далее - страница никак не реагирует 0

Правильная установка кода на событие onclick

Решение