Thread: What is a click-handler and how to execute it from Javascript?

The easiest way to do this is by using the thingy like this:

Code:

<i class="aaa bbb ccc" 

<script>
function StopTheX(){
	alert("Stop doing that!");
}
</script>

That should be <i class="aaa bbb ccc" who ha.


But we have purists here that hate the onclick attribute and want us all to use an event listener. They don't like the alert either, but I do. And I personally don't like the <i> tag to do this in.

Lots of opinions and dislikes here.

To make things easy I inserted a ID, because classes implies a lot of them and we would need to search though them all to find out which element I was listening to was clicked.

Code:

<i class="aaa bbb ccc" id="my_x">X</i>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
document.getElementById("my_x").addEventListener("click", function(){alert('Stop That, I say!')});
</script>

you can only have one handler
you can have as many listemers as you like

<i class="aaa bbb ccc" >X</i>

<script>
my_x = document.getElementsByClassName("aaa")[0];
my_x.onclick=function(){alert('from handler')};//the one and only handler
my_x.addEventListener("click", function(){alert('from listener1')});
my_x.addEventListener("click", function(){alert('from listener2')});

my_x.onclick();//this will execute the handler only
my_x.click();//this will execute the handler and all listeners
</script>