Add JavaScript Confirmation On HTML Link Click with Advanced event handling

Advanced event handling

 However normally you wish to separate your current HTML as well as Javascript, so You might want to don't utilize inline event handlers, but put a class with your link as well as add opertation listener for it.

 

 

<a href="test.php?id=3211" class="confirmation">My Link</a>

//Java script part
<script type="text/javascript">
    var elems = document.getElementsByClassName('confirmation');
    var confirmIt = function (e) {
        if (!confirm('Are you sure?')) e.preventDefault();
    };
    for (var i = 0, l = elems.length; i < l; i++) {
        elems[i].addEventListener('click', confirmIt, false);
    }
</script>

This example will only work in modern browsers (for older IEs you should utilize attachEvent(), returnValue and provide a implementation for getElementsByClassName() or start using a library like jQuery that will help with cross-browser issues).

Share on Google Plus

About srimaster

Tech Dropper is simple, easy and newest technology source with experiments and demos. I will give you tutorials, notes, code snippets, demos using PHP, MySQL, jQuery, HTML, CSS, Ajax and Javascripts.