Поймать тег img и изменить изображение

0

У меня есть одна проблема с кодом javascript. Я знаю, как это сделать с помощью jQuery, но я должен использовать js для этого. Мне нужно, когда кто-то нажимает на первый div, чтобы поймать изображение "show.png" в первом div и изменить его с другим

У меня есть 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-код для расширения и коллапса второго div.

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;
}

FYI Не говорите мне: "Этот код a..ul" - я знаю это, но у меня есть запрос просто добавить, а не изменять.

Поэтому я не могу добавить идентификатор и использовать его с 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

  • 0
    Похоже, вам не хватает пробела на vari

1 ответ

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 у вас есть весь URL.

Пример Plunker

Изображение вы можете легко изменить следующим образом:

i.src = "images/newShow.png";
  • 0
    Да, это работает, но если я добавлю это на мой сайт, это не работает. В элементе ispect я вижу сообщение об ошибке: Uncaught TypeError: Невозможно правильно прочитать css из null. Кстати, как я могу написать img.src == "picture.jpg", потому что i.src.indexOf ("images / show.png")! == -1 не завершают работу
  • 0
    Я вижу в чем проблема. Проблема в этой строке var ttable = document.getElementsByTagName ("table"). Item (0); Документ должен измениться с sometnihk, потому что у меня есть много div с этим js, и это должно работать на каждом. Я пытался с этим. но это не работает
Показать ещё 6 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню