Ссылка внутри атрибута точки данных Сова Карусель - PullRequest
Новая
       108

Ссылка внутри атрибута точки данных Сова Карусель

0 голосов
/ 06 марта 2020

Когда я добавляю ссылку (тег) в атрибут data-dot, это нарушает макет. Например, 

data-dot="<div class='meta-content'><img src='https://imagelink.com'><h4>Name</h4><a href="https://link.com" target='_blank'>Web Address</a></div>"

1 Ответ

0 голосов
/ 06 марта 2020

Чтобы сохранить HTML во встроенном атрибуте data, необходимо HTML -кодировать содержимое, чтобы оно не мешало внешней структуре HTML: 

$('a').on('click', function(e) {
  e.preventDefault();
  $('#output').append($(this).data('dot'));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" data-dot="&lt;div class='meta-content'&gt;&lt;img src='https://imagelink.com'&gt;&lt;h4&gt;Name&lt;/h4&gt;&lt;a href='https://link.com' target='_blank'&gt;Web Address&lt;/a&gt;&lt;/div&gt;">Click me</a>

<div id="output"></div>

Как говорится, нехорошо хранить HTML в атрибуте data. Вместо этого я бы предложил хранить там сериализованную структуру данных и использовать ее для построения HTML, которую вы clone() из DOM.

...