onclick multiple event handling for external javascript
The problem: making a very simple style switcher with js (without inline event handling). This is probably easy to do. I've confused myself with handling multiple onclick events however and just proped everything up with inline. Anyone know how to handle multiple onclick events?
The Html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head><title>page 2</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" id="style" type="text/css" href="style.css" />
<script type="text/javascript" src="switcher.js"></script>
</head>
&开发者_开发技巧lt;body>
<h1>page 2</h1>
<hr/>
<div id="nav">
<ul id="pages">
<li><a href="#" id="style1" onclick="style_one()" >Style 1</a></li>
<li><a href="#" id="style2" onclick="style_two()">Style 2</a></li>
<li><a href="#" id="style3" onclick="style_three()" >Style 3</a></li>
<li><a href="page3.htm">Page 3</a></li>
</ul>
<ul id="logout">
<li><a href="login.htm">Log Out</a></li>
</ul>
</div>
<hr/>
</body>
</html>
The external JS so far
function style_one()
{
document.getElementById("style").href="style1.css";
}
function style_two()
{
document.getElementById("style").href="style2.css";
}
function style_three()
{
document.getElementById("style").href="style3.css";
}
if (element.addEventListener) // most browsers
element.addEventListener(eventName, listener, true);
else if (element.attachEvent) // IE
element.attachEvent('on' + eventName, listener);
For instance:
function addDomListener: function(element, eventName, listener) {
if (element.addEventListener) // most browsers
element.addEventListener(eventName, listener, true);
else if (element.attachEvent) // IE
element.attachEvent('on' + eventName, listener);
}
addDomListener(document.getElementById("style"), "click", function () {
//Handle onclick #1
});
addDomListener(document.getElementById("style"), "click", function () {
//Handle onclick #2
});
Edit: Unless I'm not understanding the question...My brain's fried as I've been staring at code all day
加载中,请稍侯......
精彩评论