Как я могу установить атрибуты (основанные на дочерних атрибутах) в jQuery или JavaScript?

Я хочу установить атрибут при наведении курсора на его дочерние атрибуты с помощью jQuery. Я пробовал много способов сделать это, но безуспешно. Все атрибуты такие же и не меняются при наведении курсора.

<li class = "menu-item">
  <a data-src = "" class = "menu-item-link" href = "#">Item one</a>
  <span class = "description">
    <img  src = "https://i.ibb.co/LxSKFgH/image1.jpg">
  </span>
</li>

<li class = "menu-item">
  <a data-src = "" class = "menu-item-link" href = "#">Item two</a>
  <span class = "description">
    <img src = "https://i.ibb.co/TLJL7hq/image2.jpg">
  </span>
</li>

Я хочу, чтобы при наведении курсора на .menu-item я хотел установить атрибут img .description в атрибуте data-src для каждого меню. Это означает, что атрибут должен быть установлен для его родительского атрибута.

Итак: когда вы наводите указатель мыши на .menu-item, вы хотите изменить src на img на то, что есть у as data-src?

— 30.12.2018 18:31

вы должны включить свой код jquery / javascript

— 30.12.2018 18:37

Да @YaakovAinspan. я хочу этот

— 30.12.2018 18:40

Так что ты пробовал?

— 30.12.2018 18:41

Привет @DaFois Я пробовал с этим pastebin.com/q3tXHwsE

— 30.12.2018 18:42

Привет @YaakovAinspan, я пробовал с этим pastebin.com/q3tXHwsE

— 30.12.2018 18:45

Пожалуйста, введите код в вопрос. См. Как создать минимальный, полный и проверяемый пример.

— 30.12.2018 18:46

javascript jquery html

30.12.2018 18:29

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете добиться желаемого, выполнив следующий скрипт jQuery:

$(".menu-item").hover(function(){
   //Take the src value from the inner img tag
   let srcValue = ($(this).find("img").attr("src"));
   //Set the data-src attribute of the inner anchor tag
   $(this).find("a").attr("data-src", srcValue);
});

Работайте как шарм! Спасибо

— 30.12.2018 19:00

30.12.2018 18:47