Правильная установка кода на событие 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, с каждым днём уходит в прошлое, но это уже совсем другая история, достойная нового холивара

Новые блоги и статьи Все статьи Все блоги /
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .

@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

Решение