Posted on 2006-08-02 21:15
兵临城下 阅读(399)
评论(4) 编辑 收藏 所属分类:
JavaScript
光说很难说清楚，我给大家演示一下：
网页中存在这样的一个数组，通过script打出的 <script>var pdt =[1,2];</script>，逻辑是想通过这个数组的长度来控制一张图片的链接:<img id = "ref" src="/reference.tif" width="389"/>。
控制方法如下：在<body onload = "reference()">中调用这个js方法。
function reference() {
var img = document.getElementById("ref");
if(typeof(pdt) = = undefined || pdt.length = =0) {
img.style.filter = "Gray";
}else{ img.onclick="REF_ON()"; }
}
运行后页面没有提示任何js错误，在pdt不为空时察看代码，图片链接中已变为:<img id = "ref" onclick = "REF_ON()" src="/reference.tif" width="389" />，说明js方法已添加成功，然而点击图片时却没有任何反应，不知为何？
后和同事讨论，将代码改变如下就OK了：
<img id = "ref" onclick="REF_ON()" src="/reference.tif" width="389"/>将方法调用先直接写入页面中，JS方法改变如下：
function reference() {
var img = document.getElementById("ref");
if(typeof(pdt) = = null || pdt.length = =0) {
img.style.filter = "Gray";
img.onclick = null;
}
}
两种方法在逻辑上看没什么区别，但最终实现确不一样，想请教大家，第一种方法为何不行？奇怪的是JS方法已把onclick成功加入到页面中，为什么点击后没有反应??