Saya sarankan menghindari JavaScript sebaris:
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;
}
};
}
Demo JS Fiddle .
Di atas diperbarui untuk mengurangi ruang, meskipun mempertahankan kejelasan / fungsi:
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?");
};
}
Demo JS Fiddle .
Pembaruan yang agak terlambat, untuk digunakan addEventListener()(seperti yang disarankan, oleh bažmegakapa , dalam komentar di bawah):
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);
}
Demo JS Fiddle .
Di atas mengikat fungsi untuk acara setiap tautan individu; yang berpotensi sangat boros, ketika Anda bisa mengikat penanganan acara (menggunakan delegasi) ke elemen leluhur, seperti berikut ini:
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);
Demo JS Fiddle .
Karena penanganan peristiwa melekat pada bodyelemen, yang biasanya berisi sejumlah elemen lain yang dapat diklik, saya telah menggunakan fungsi sementara ( actionToFunction) untuk menentukan apa yang harus dilakukan dengan klik itu. Jika elemen diklik adalah link, dan karena itu memiliki tagNamedari a, klik-penanganan dilewatkan ke reallySure()fungsi.
Referensi: