Вставить атрибуты title и alt для картинки
День добрый коллеги!
Имею такую функцию: if(item.type === 'image') { item.img = $('<img class="mfp-img" />').on('load.mfploader', function() { item.hasSize = true; }).on('error.mfploader', function() { item.hasSize = true; item.loadError = true; _mfpTrigger('LazyLoadError', item); }).attr('src', item.src); Нужно вставить тайтл и альт для изображения. В php это сделано так: class="h1_product">{{ heading_title }} {{ model }} Вот эти два поля {{ heading_title }} {{ model }} мне и нужно вставить в качестве тайтла и альта. Как это сделать....туплю. Спасибо! |
Наведите на мысль, как {{ heading_title }} {{ model }} вогнать и в тайтл и в альт. Понятно, что через .attr('alt',... как передать эти значения не врублюсь никак...
|
Bort575, Можно так:
<script> const product={ title:'{{ heading_title }}', model:'{{ model }}' }; </script> <script> $('.some-elem img').attr(product); </script> |
Так, уже чувствую понятнее становится...
А как это вставить в js - файл. Там немного другая структура, оттого и весь сыр-бор.
_preloadItem: function(index) { index = _getLoopedId(index); if(mfp.items[index].preloaded) { return; } var item = mfp.items[index]; if(!item.parsed) { item = mfp.parseEl( index ); } _mfpTrigger('LazyLoad', item); if(item.type === 'image') { item.img = $('<img class="mfp-img" />').on('load.mfploader', function() { item.hasSize = true; }).on('error.mfploader', function() { item.hasSize = true; item.loadError = true; _mfpTrigger('LazyLoadError', item); }).attr('src', item.src); } item.preloaded = true; } |
Bort575, можно объявление "константы" можно оставить в шаблоне, а в скрипте уже работать с константой.
Однако лучше элементу с классом "h1_product" добавить необходимые данные в data-атрибут, а из скрипта просто прочитать их. |
Да уж....но мой опыт пока на уровне "моя твоя не понимает"...
Профессор, я как та собака....понимать понимаю, как сделать не пойму....уже способов 15 опробовал ...мозг дымит. Всё сделал, весь код ...а тут затык и писец прям! :-?
|
Bort575, данные в data-атрибутах нужно экранировать.
<h1 class="h1_product" data-title="{{ heading_title }}" data-model="{{ model }}">{{ heading_title }} {{ model }}</h1> <script> //Это в вашем скрипте const $header=$('h1.h1_product'); $('.some-elem img').attr({ title:$header.data('title'), alt:$header.data('model') }); </script> -------------- Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Так, кажись дошло)))))
Спасибо огромное, сейчас буду лабать код))))) Хорошего дня!
|
Часовой пояс GMT +3, время: 16:21. |