AS
Javascript
Event Attachment
Si considera buona norma associare le funzioni Javascript ai vari eventi con addEventListener anziché attraverso la scrittura in linea tipo onclick="function();".
In questo esempio la funzione clickFunct viene chiamata dal click e le funzioni mouseOverFunct e mouseOutFunct al passaggio del mouse effettuati all'interno dell'elemento id="divId".
Nel primo box il codice completo HTML/Javascript. Nel secondo box il risultato.
<!DOCTYPE html>
<head>
<script>
function clickFunct()
{
var a;
a=document.getElementById("divId").innerHTML;
document.getElementById("divId").innerHTML=a+"<br>"+"This is an addEventListener example. Click again!";
}
function mouseOverFunct()
{
document.getElementById("divId").style.backgroundColor="#fda";
}
function mouseOutFunct()
{
document.getElementById("divId").style.backgroundColor="#fff";
}
</script>
</head>
<body>
<div id="divId" style="cursor:pointer;">Click here</div>
<script>
if (document.addEventListener)
{
document.getElementById("divId").addEventListener("click", clickFunct);
document.getElementById("divId").addEventListener("mouseover", mouseOverFunct);
document.getElementById("divId").addEventListener("mouseout", mouseOutFunct);
}
else// evtl for cross browser support
if(document.attachEvent)
{
document.getElementById("divId").attachEvent("onclick", clickFunct);
document.getElementById("divId").attachEvent("onmouseover", mouseOverFunct);
document.getElementById("divId").attachEvent("onmouseout", mouseOutFunct);
}
</script>
</body>
</html>
Click here