Установить событие onclick с помощью script
Я хочу, чтобы мой script
установил свойство onclick
для <div>
.
Я использую этот HTML-код:
<div id="forgotpass">Forgot Password?</div>
Я хочу, когда пользователь нажимает кнопку <div>
a forgotpass()
для запуска, но я не хочу использовать это:
<div id="forgotpass" onclick="forgotpass();">Forgot Password?</div>
Ответы
Ответ 1
Чистый JavaScript:
function addListener(element, eventName, handler) {
if (element.addEventListener) {
element.addEventListener(eventName, handler, false);
}
else if (element.attachEvent) {
element.attachEvent('on' + eventName, handler);
}
else {
element['on' + eventName] = handler;
}
}
function removeListener(element, eventName, handler) {
if (element.addEventListener) {
element.removeEventListener(eventName, handler, false);
}
else if (element.detachEvent) {
element.detachEvent('on' + eventName, handler);
}
else {
element['on' + eventName] = null;
}
}
addListener(document.getElementById('forgotpass'), 'click', forgotpass);
JQuery
$(document).ready(function() {
$("#forgotpass").click(forgotPass);
});
Или:
$(document).ready(function() {
$("#forgotpass").click(function() {
forgotPass();
});
});
Ответ 2
Кроме того, если вы не используете jQuery:
document.getElementById('forgotpass').onclick = forgotpass;
Ответ 3
В чистом javascript вы можете:
function forgotpass() {
//..code
}
var el = document.getElementById("forgotpass");
el.onclick = forgotpass;
но это очень наивно, не является гибким и, вероятно, плохой практикой.
Если вы используете jQuery, вы можете сделать:
function forgotpass() {
//..code
}
$(document).ready(function() {
$("#forgotpass").click(function() {
forgotPass();
});
});
Ответ 4
Если вам нужно только поддерживать IE 9+ (источник), вы можете использовать EventTarget.addEventListener
в чистом JavaScript.
function forgotpass() {
alert("Hello, world!");
}
var element = document.getElementById("forgotpass");
element.addEventListener("click", forgotpass, false);
<button id="forgotpass">Forgot Password?</button>
Ответ 5
Вы можете сделать это с помощью jQuery, например
$("#forgotpass").click(function() {
alert("Handler for .click() called.");
});
Ответ 6
Что-то вроде этого может работать.
var div = document.getElementById("forgotpass");
div.onclick=function(){ /*do something here */ };
Если вы не добавите функцию, javascript будет запускать onclick, как только она пройдет через script.
Ответ 7
Добавление списка событий непосредственно в HTML:
...
<div>
<input type="button" value="Set Cookie" onclick="setCookie();" />
</div>
<script>
function setCookie() {
console.log('ready to set cookie?');
}
</script>
...
Удачи!
Ответ 8
Если вы используете jQuery, лучше всего сделать это следующим образом. Если вызов функции выполняется несколько раз, будут зарегистрированы несколько обработчиков событий. Следующий подход позволяет удалить предыдущие обработчики.
$("#forgotpass").off().on('click', function () {
forgotPass();
});