Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.11.2016, 16:04
Интересующийся
Отправить личное сообщение для rudoy24 Посмотреть профиль Найти все сообщения от rudoy24
 
Регистрация: 26.12.2014
Сообщений: 16

Изменение alt у картинок
Есть код результатом которого получаем alt у картинки, а в поле input-a можем его изменить на другой.
<html>
<body>
<img src="kartinka.jpg" alt="Image alt">
<input id="imgalt" value="" onchange="myFunction()">
<script>
document.getElementById("imgalt").value = document.getElementsByTagName("img").item(0).alt;
function myFunction() {
document.getElementsByTagName("img").item(0).alt = document.getElementById("imgalt").value;
}
</script>
</body>
</html>

Каким образом добится изменения alt-а для каждой картиноки индивидуально?
<img src="kartinka1.jpg" alt="Image alt1">
<input id="imgalt" value="" onchange="myFunction()">

<img src="kartinka2.jpg" alt="Image alt2">
<input id="imgalt" value="" onchange="myFunction()">

<img src="kartinka3.jpg" alt="Image alt3">
<input id="imgalt" value="" onchange="myFunction()">

...
Ответить с цитированием
  #2 (permalink)  
Старый 16.11.2016, 16:25
Аватар для Coriolan161
Профессор
Отправить личное сообщение для Coriolan161 Посмотреть профиль Найти все сообщения от Coriolan161
 
Регистрация: 21.11.2015
Сообщений: 440

rudoy24,
Брат вместо onchange надо oninput
Почитай https://learn.javascript.ru/events-change
Ответить с цитированием
  #3 (permalink)  
Старый 16.11.2016, 17:28
Лаборант :-)
Отправить личное сообщение для Pavel M. Посмотреть профиль Найти все сообщения от Pavel M.
 
Регистрация: 08.11.2011
Сообщений: 806

можно так
и обработчик можно на каждый input не вешать
старые IE не учитывал
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Alt change</title>
</head>
<body>
  
<p><img src="kartinka1.jpg" alt="Image alt1">
<input class="imgalt" value="Image alt1">

<p><img src="kartinka2.jpg" alt="Image alt2">
<input class="imgalt" value="Image alt2">

<p><img src="kartinka3.jpg" alt="Image alt3">
<input class="imgalt" value="Image alt3">
  
<script>
  
  document.body.addEventListener('input', function (event) {
    var target = event.target,
        text = target.value;
    target.previousElementSibling.alt = text;
  }, false);
  
</script>
</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 18.11.2016, 13:53
Интересующийся
Отправить личное сообщение для rudoy24 Посмотреть профиль Найти все сообщения от rudoy24
 
Регистрация: 26.12.2014
Сообщений: 16

Pavel M. - благодарю, именно то что нужно
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Смена картинок на JS. Помогите реализовать! Aggao Элементы интерфейса 3 27.11.2014 23:32
Изменение координат картинок dimonesk Javascript под браузер 0 15.02.2013 15:53
изменение картинок в зависимости от значения input jump91 Общие вопросы Javascript 2 30.01.2012 09:57
IE: dсплывающая подсказка - как "погасить" для img трибут ALT? Nominus umbra Элементы интерфейса 1 23.05.2010 04:52
Изменение свойств картинок в документе Gekt0r Общие вопросы Javascript 10 14.08.2008 18:33