html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>image gallery</title>
<link rel="Stylesheet" href="styles/layout.css" type="text/css"/>
<script type="text/javascript">
function showPic(whichpic)
{
imgSource = whichpic.getAttribute("href");
placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",imgSource);
var text = whichpic.getAttribute("title");
var description = document.getElementById("description");
description.firstChild.nodeValue = text;
//alert(description.childNodes[0].nodeValue);
}
function countBodyChildren()
{
var body_element = document.getElementsByTagName("body")[0];
nodeLength = body_element.childNodes.length;
alert(body_element.nodeType);
// for(i=0;i<nodeLength;i++)
// {
// alert(body_element.childNodes[i].nodeType);
// }
}
//window.onload = countBodyChildren;
</script>
</head>
<body>
<h1>Snapshots</h1>
<ul>
<li>
<a href="img/1.jpg" title="A fireworks display" onclick="return false;showPic(this);">Fireworks</a>
</li>
<li>
<a href="img/2.jpg" title="A cup of black coffee" onclick="showPic(this);return false;">Coffee</a>
</li>
<li>
<a href="img/3.jpg" title="A red,red rose" onclick="showPic(this);return false;">Rose</a>
</li>
<li>
<a href="img/4.jpg" title="The famous clock" onclick="showPic(this);return false;">Big Ben</a>
</li>
</ul><br /><br />
<img id="placeholder" src="img/1.jpg" alt="my image gallery" width="400px" height="300px" />
<p id="description">Choose an image.</p>
</body>
</html>
<head runat="server">
<title>image gallery</title>
<link rel="Stylesheet" href="styles/layout.css" type="text/css"/>
<script type="text/javascript">
function showPic(whichpic)
{
imgSource = whichpic.getAttribute("href");
placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",imgSource);
var text = whichpic.getAttribute("title");
var description = document.getElementById("description");
description.firstChild.nodeValue = text;
//alert(description.childNodes[0].nodeValue);
}
function countBodyChildren()
{
var body_element = document.getElementsByTagName("body")[0];
nodeLength = body_element.childNodes.length;
alert(body_element.nodeType);
// for(i=0;i<nodeLength;i++)
// {
// alert(body_element.childNodes[i].nodeType);
// }
}
//window.onload = countBodyChildren;
</script>
</head>
<body>
<h1>Snapshots</h1>
<ul>
<li>
<a href="img/1.jpg" title="A fireworks display" onclick="return false;showPic(this);">Fireworks</a>
</li>
<li>
<a href="img/2.jpg" title="A cup of black coffee" onclick="showPic(this);return false;">Coffee</a>
</li>
<li>
<a href="img/3.jpg" title="A red,red rose" onclick="showPic(this);return false;">Rose</a>
</li>
<li>
<a href="img/4.jpg" title="The famous clock" onclick="showPic(this);return false;">Big Ben</a>
</li>
</ul><br /><br />
<img id="placeholder" src="img/1.jpg" alt="my image gallery" width="400px" height="300px" />
<p id="description">Choose an image.</p>
</body>
</html>
同事为了能点击 用css控制指针样式就是
<title>image gallery</title>
<link rel="Stylesheet" href="styles/layout.css" type="text/css"/>
<script type="text/javascript">
function showPic(whichpic,e)
{
imgSource = whichpic.getAttribute("href");
placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",imgSource);
var text = whichpic.getAttribute("title");
var description = document.getElementById("description");
description.firstChild.nodeValue = text;
e = e || window.event;
if (e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
//alert(description.childNodes[0].nodeValue);
}
function countBodyChildren()
{
var body_element = document.getElementsByTagName("body")[0];
nodeLength = body_element.childNodes.length;
alert(body_element.nodeType);
// for(i=0;i<nodeLength;i++)
// {
// alert(body_element.childNodes[i].nodeType);
// }
}
//window.onload = countBodyChildren;
</script>
</head>
<body>
<h1>Snapshots</h1>
<ul>
<li>
<a href="img/1.jpg" title="A fireworks display" onclick="return false;showPic(this);">Fireworks</a>
</li>
<li>
<a href="img/2.jpg" title="A cup of black coffee" onclick="showPic(this);return false;">Coffee</a>
</li>
<li>
<a href="img/3.jpg" title="A red,red rose" onclick="showPic(this,event);return false;">Rose</a>
</li>
<li>
<a href="img/4.jpg" title="The famous clock" onclick="showPic(this);return false;">Big Ben</a>
</li>
</ul><br /><br />
<img id="placeholder" src="img/1.jpg" alt="my image gallery" width="400px" height="300px" />
<p id="description">Choose an image.</p>
</body>
</html>
阻止默认事件? 楼主试试
http://blog.csdn.net/net_lover/article/details/7162136