我的javascript代码存在一个问题。我知道如何使用jQuery,但我必须使用js。当有人点击第一个div以在第一个div中捕获图像“show.png”并将其更改为另一个
时,我需要我有这样的HTML代码(这个用不同的ID重复几次)
<div class="clickdown" onclick="return toggleMe('p_202')">
<table>
<tr valign="top">
<td width="20px">
<img src="images/show.png" align="top" alt="" />
</td>
<td>
<b>textttext</b> <img src="images/btn_New.png" alt="" />
</td>
</tr>
</table>
</div>
<div id="p_202" class="clickdown_content" style="display: none;">
<p>
texttexttexttexttexttexttext
</p>
</div>
并存在用于展开和缩小第二个div的Javascript代码。
function toggleMe(a) {
var e = document.getElementById(a);
if (!e) return true;
if (e.style.display == "none") {
e.style.display = "block"
} else {
e.style.display = "none"
}
return true;
}
仅供参考我不要告诉我“这段代码是......” - 我知道但是我要求添加,而不是更改任何内容。
所以我无法添加ID并将其与getElementByID()
一起使用我尝试这样的东西,但是不起作用(这里我隐藏图像只是为了看看是否有效)
function toggleMe(a) {
var ttable = document.getElementsByTagName("table").item(0);
var ttr = ttable.getElementsByTagName("tr").item(0);
var ttd = ttr.getElementsByTagName("td").item(0);
vari = ttd.getElementsByTagName("img").item(0);
if (i.src == "images/btn_New.png") {
i.style.display == "none"
} else {
i.style.display = "block"
};
var e = document.getElementById(a);
if (!e) return true;
if (e.style.display == "none") {
e.style.display = "block"
} else {
e.style.display = "none"
}
return true;
}
恢复:
我必须保留旧代码html和javascript并添加新的javascript代码
答案 0 :(得分:0)
有效:
function toggleMe(a) {
var ttable = document.getElementsByTagName("table").item(0);
var ttr = ttable.getElementsByTagName("tr").item(0);
var ttd = ttr.getElementsByTagName("td").item(0);
var i = ttd.getElementsByTagName("img").item(0);
if (i.src.indexOf("images/show.png") !== -1) {
i.style.display = "none";
} else {
i.style.display = "block";
}
var e = document.getElementById(a);
if (!e) return true;
if (e.style.display == "none") {
e.style.display = "block";
} else {
e.style.display = "none";
}
return true;
}
您必须使用indexOf,因为在属性 src 中您拥有整个网址。
您可以通过这种方式轻松更改图片:
i.src = "images/newShow.png";