«Скрытие» событий javascript в DOM

Я разрабатываю индивидуальный процесс заказа, и я часто использую запросы AJAX и динамические формы для завершения частей процесса заказа, но я бы хотел очистить способ, которым я делая это в терминах HTML. Я тоже использую jQuery.«Скрытие» событий javascript в DOM

Рассматривая приложения, такие как текстовый процессор Google, я вижу, что как DOM, так и источник не имеют атрибутов событий javascript. Например:

<div id="docs-file-menu" role="menuitem" class="menu-button goog-control goog-inline-block" aria-disabled="false" aria-expanded="false" aria-haspopup="true" style="-webkit-user-select: none;">File</div>

Я предполагаю, что скрипт регистрирует события Javascript после факта, основанного на атрибутах HTML.

Мой сайт намного менее сложный, но мне было интересно, как подойти к нему, поскольку в настоящее время у меня есть кнопки с надписью <a><img></a> теги (или аналогичные), которые вызывают функции Javascript, которые отлично работают, но кажутся менее (и старой школой) подход. Например:

<a href="javascript:Customisation.beginNewPair()"> 
    <img src="images/begin-new.gif" /> 
</a>

источник

2014-12-20 Nick Bedford

Вы говорите, что вы используете JQuery? Посмотрите на обработчики кликов - они являются одной из самых полезных функций. http://api.jquery.com/click/ –

@AntP Я знаю все об этом. Думаю, я в любом случае отвечал на свой вопрос. «Запустите сценарий после загрузки DOM для ввода всех ваших событий». Ха-ха. –

Если вы знаете все об этом, все, что вам нужно сделать, это написать обработчик кликов для вашего якоря. Я полагаю. Трудно сказать, поскольку вы на самом деле не заявили, что пытаетесь сделать. –

Вот простой пример того, как использовать атрибуты данных и EventListener по щелчку:

var a = document.getElementById('docs-file-menu'); 
a.addEventListener('click', test); 

function test() { 
var dis = a.getAttribute('aria-disabled'); 
var exp = a.getAttribute('aria-expanded'); 
var has = a.getAttribute('aria-haspopup'); 


    if (dis == 'true') { 
     alert('disabled = true'); 
    } 
    if (exp == 'true') { 
     alert('expanded = true'); 
    } 
    if (has == 'true') { 
     alert('haspopup = true'); 
    } 

}

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

Вот простой DEMO с OnClick событие, просто нажмите на кнопку File

источник

2014-12-20 23:07:18 baao

У меня было ощущение, что это было так просто, как пост-DOM-скрипт, вручную добавляющий события ... –

Это очень просто, но очень полезно – baao

Что вы хотите addEventListener.

Как вы обращаетесь к элементам - это еще один вопрос, но говорите, что хотите получать предупреждение каждый раз, когда кто-то нажимает на ящик.

var box = document.getElementById('box'); 
 
box.addEventListener('click', function(){ alert(); });

<div id="box" style="width:150px;height:150px;background:blue;"></div>

Вы также можете поместить то, что происходит в реальной функции:

function doSomething(){ 
 
    alert(); 
 
} 
 

 
var box = document.getElementById('box'); 
 
box.addEventListener('click', doSomething);

<div id="box" style="width:150px;height:150px;background:blue;"></div>

источник

2014-12-20 23:07:18 David

«Скрытие» событий javascript в DOM

ответ

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