JavaScript DHTML/Event/Hyper Link Event
Содержание
Handling onClick or Links
<source lang="html4strict">
<HTML> <HEAD> <TITLE>Handling onClick for links</TITLE> <SCRIPT LANGUAGE="JavaScript">
</SCRIPT> </HEAD> <BODY>
Handling onClick for links
<A HREF="http://www.wbex.ru" ONCLICK="return confirmLink()"> Asks you to confirm your selection of this link.</A>
</BODY> </HTML>
</source>
Handling onMouseOut or Links
<source lang="html4strict">
<HTML> <HEAD> <TITLE>Handling onMouseOut for links</TITLE> <SCRIPT LANGUAGE="JavaScript">
</SCRIPT> </HEAD> <BODY>
Handling onMouseOut for links
<A HREF="somewhere" ONMOUSEOUT="advertiseLink()">Tells you why you should connect to this link.</A>
</BODY> </HTML>
</source>
Using Functions as Event Handlers
<source lang="html4strict">
<HTML> <HEAD> <TITLE>Using functions as event handlers</TITLE> <SCRIPT LANGUAGE="JavaScript">
</SCRIPT> </HEAD> <BODY>
Using functions as event handlers
<A HREF="somewhere" onClick="return false" onMouseOver="confirmLink()">Confirms whether you want to connect via this link.</A>
</BODY> </HTML>
</source>
Using onClick and onDblClick Event Handlers
<source lang="html4strict">
<HTML> <HEAD> <TITLE>onClick and onDblClick Event Handlers</TITLE> <SCRIPT LANGUAGE="JavaScript"> var msg = ""; function showClick() {
msg = "The element has been clicked. "; status = msg;
} function showDblClick() {
msg = "The element has been double-clicked."; status = msg; return false;
} </SCRIPT> </HEAD> <BODY>
onClick and onDblClick Event Handlers
<A HREF="#" onClick="showClick();return false" onDblClick="return showDblClick()"> A sample link.</A> </BODY> </HTML>
</source>
Using onMouseOver and onMouseOut Event Handlers
<source lang="html4strict">
/* JavaScript Bible, Fourth Edition by Danny Goodman John Wiley & Sons CopyRight 2001
- /
<HTML> <HEAD> <TITLE>onMouseOver and onMouseOut Event Handlers</TITLE> <SCRIPT LANGUAGE="JavaScript"> function setStatus(msg) {
status = msg return true
} // destination of all link HREFs function emulate() {
alert("Not going there in this demo.")
} </SCRIPT> </HEAD> <BODY>
onMouseOver and onMouseOut Event Handlers
Pledge of Allegiance
I pledge <A HREF="javascript:emulate()" onMouseOver="return setStatus("View
dictionary definition")" onMouseOut="return setStatus("")">allegiance</A> to the
<A HREF="javascript:emulate()" onMouseOver="return setStatus("Learn about the
U.S. flag (http://lcweb.loc.gov)")" onMouseOut="return setStatus("")">flag</A>
of the <A HREF="javascript:emulate()" onMouseOver="return setStatus("View info
about the U.S. government")" onMouseOut="return setStatus("")">United States of
America</A>, and to the Republic for which it stands, one nation <A
HREF="javascript:emulate()" onMouseOver="return setStatus("Read about the
history of this phrase in the Pledge")" onMouseOut="return setStatus("")">under
God</A>, indivisible, with liberty and justice for all.
</BODY> </HTML>
</source>
Using the const Keyword
<source lang="html4strict">
<HTML> <HEAD> <TITLE>const(ant)</TITLE> <SCRIPT LANGUAGE="JavaScript"> const FREEZING_F = 32 var cities = ["A", "B", "C", "B", "D"]; var tempsF = [33, 12, 20, 40, 75]; function showData() {
var tableData = "";
for (var i = 0; i < cities.length; i++) {
tableData += "<TR><TD>" + cities[i] + "</TD><TD "
tableData += (tempsF[i] < FREEZING_F) ? "CLASS="cold"" : ""
tableData += ">" + tempsF[i] + "</TR>"
}
document.getElementById("display").innerHTML = tableData
} </SCRIPT> </HEAD> <BODY onLoad="showData()">
The const keyword
| City | Temperature |
|---|
</BODY> </HTML>
</source>
<source lang="html4strict">
<HTML> <HEAD> <TITLE>Using the event Object</TITLE> <SCRIPT></SCRIPT> </HEAD> <BODY>
Using the event Object
<A HREF="javascript:void(0)" onClick="clickHandler(event)">Click this link.</A> </BODY> </HTML>
</source>
