Я б рекомендував уникати вбудованого JavaScript:
var aElems = document.getElementsByTagName('a');
for (var i = 0, len = aElems.length; i < len; i++) {
aElems[i].onclick = function() {
var check = confirm("Are you sure you want to leave?");
if (check == true) {
return true;
}
else {
return false;
}
};
}
Демонстрація JS Fiddle .
Наведене вище оновлено для зменшення простору, незважаючи на збереження чіткості / функції:
var aElems = document.getElementsByTagName('a');
for (var i = 0, len = aElems.length; i < len; i++) {
aElems[i].onclick = function() {
return confirm("Are you sure you want to leave?");
};
}
Демонстрація JS Fiddle .
Дещо запізніле оновлення для використання addEventListener()(як запропонував bažmegakapa , у коментарях нижче):
function reallySure (event) {
var message = 'Are you sure about that?';
action = confirm(message) ? true : event.preventDefault();
}
var aElems = document.getElementsByTagName('a');
for (var i = 0, len = aElems.length; i < len; i++) {
aElems[i].addEventListener('click', reallySure);
}
Демонстрація JS Fiddle .
Вищезазначене пов'язує функцію з подією кожної окремої ланки; що потенційно є досить марним, коли ви можете пов'язувати обробку подій (використовуючи делегування) з елементом предка, таким як:
function reallySure (event) {
var message = 'Are you sure about that?';
action = confirm(message) ? true : event.preventDefault();
}
function actionToFunction (event) {
switch (event.target.tagName.toLowerCase()) {
case 'a' :
reallySure(event);
break;
default:
break;
}
}
document.body.addEventListener('click', actionToFunction);
Демонстрація JS Fiddle .
Оскільки обробка подій приєднана до bodyелемента, який зазвичай містить безліч інших елементів, на які можна натиснути, я використав проміжну функцію ( actionToFunction), щоб визначити, що робити з цим клацанням. Якщо клацнути мишею елемент є посиланням, і , отже , має tagNameз a, клік-звернення передається вreallySure() функції.
Список літератури: