簡體   English   中英

捕獲img標簽並更改圖像

[英]Catch img tag and change image

我的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>&nbsp;&nbsp;<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>

並存在用於擴展和折疊第二格的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;
}

僅供參考,不要告訴我“此代碼是a..ul”-我知道,但是我要求僅添加而不更改任何內容。

所以我不能添加ID並將其與getElementByID()一起使用

我嘗試了類似的操作,但是不起作用(在這里我隱藏圖像只是為了看ti是否起作用)

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代碼

有用:

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屬性中您擁有整個URL。

柱塞示例

您可以通過以下方式輕松更改圖像:

i.src = "images/newShow.png";

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM