Вставить атрибуты 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, время: 02:55. |