Как добавить html в массив?

Question

[Pazzetif]

К примеру имеем массив он большой.

var tenant_fields = []; //new Array();
                tenant_fields[0]=["Pudge", "0"];
                tenant_fields[1]=["Phantom Assassin", "1"];
                tenant_fields[2]=["Sniper", "2"];

Мне нужно вместо цифр добавить туда html код, это возможно?

Comments

[Максим Тимофеев]

вместо каких цифр? Там их много.

[Pazzetif]

Максим Тимофеев, ["Pudge", "0"];
и т.д.

[Максим Тимофеев]

Pazzetif,
А что мешает?
['Pudge', '<div>some html</div>']

[Pazzetif]

Максим Тимофеев, Проблема как я понял с ковычками у меня. Есть такой код:

<a href="" data-html="true" data-trigger="hover" data-toggle="popover" data-content="<div class='hero-footnote'>
                        <img src='images/hero/sniper.svg' alt='sniper'>
                        <div class='hero-footnote__desc'>
                            <h3>Sniper</h3>
                            <p>Дальний бой</p>
                            <span>Carry — Nuker — Mider</span>
                        </div>
                    </div>"><img src="images/hero/sniper.svg" style="width: 26px; height: 15px; margin-top: 0; margin-right: 4px" alt="">Sniper</a>

У меня в html используются и двойные и одинарные. PHPstorm их экранирует. И весь код получается нужно в кавычки тоже положить. Как это обойти?

[Максим Тимофеев]

Pazzetif, проблема в невалидном html. Откуда у Вас в html одинарные кавычки?
alt='sniper' - за такое верстальщик идет копать траншеи сразу
data-content="какойто html" - за такое верстальщик идет копать траншеи сразу
Надо иметь скрытый html - вставляем его в DOM и скрываем или имеем js объект с ним, а в data-content храним id

[Павел Ткаченко]

Pazzetif , ковычки массива одинарные, а в html двойные везде, все будет норм, или на оборот...

[Pazzetif]

Максим Тимофеев, Пример как скрыть data-content можете показать?

[Максим Тимофеев]

Pazzetif,

<div style="display: none;" id="#someid">some content</div>

[Pazzetif]

Максим Тимофеев, т.е блоки должны как-то так работать?

<a href="" data-html="true" data-trigger="hover" data-toggle="popover" data-content="20"><img src="/images/hero/sniper.svg" style="width: 26px; height: 15px; margin-top: 0; margin-right: 4px" alt="">Sniper</a>

<div style="display: none;" id="#20"><div class="hero-footnote">
                    <img src="/images/hero/sniper.svg" alt='sniper'>
                    <div class='hero-footnote__desc'>
                        <h3>Sniper</h3>
                        <p>Дальний бой</p>
                        <span>Carry — Nuker — Mider</span>
                    </div>
                </div></div>

[Максим Тимофеев]

Pazzetif, да. Но еще лучше строить этот html на базе json. Я так понимаю блоки однотипные, так что можно хранить как-то так:

var tooltips = {
'20' => {
              'src' => '/images/hero/sniper.svg',
              'title' => 'Sniper',
              'some' => 'Дальний бой'
            }
...
};

[Pazzetif]

Максим Тимофеев, У меня просто потом в data-content данные будут с помощью php выводится динамически.
Пример просто который я написал выше, не работает. Он мне просто выводит "20", а нужен чтобы выводил блок. Не подскажите, что я делаю не так? С дата атрибутами почти не работал.

[Максим Тимофеев]

Pazzetif,

будут с помощью php выводится динамически.

и что?

Не подскажите, что я делаю не так?

а Вы привели js код? Сам по себе html ничего выводить и не должен.

[Pazzetif]

Максим Тимофеев, Вроде прогуглил, вот это должно работать, но нет:

var content = '20';

                $('a').data('content',content);

[Максим Тимофеев]

Pazzetif, смотря что надо сделать. Если надо добавить дата атрибут, то лучше так:

var content = '20';
$('a').attr('data-content',content);

[Pazzetif]

Максим Тимофеев, Понял в чем была предыдущая ошибка, удалил data атрибут из html и вывело цифру.
Но когда хочу из друго блока вывести в дата атребут, то мне выводит [object Object]

var content = $('.otkuda');
$('.kuda').attr('data-content',content);

[Pazzetif]

Максим Тимофеев, Максим Тимофеев, Нашел ответ, нужно вот так:

var content = $('.otkuda').html();
$('.kuda').attr('data-content',content);

Спасибо вам большое за помощь.
Напишите ответом, отмечу решением.

[Максим Тимофеев]

Pazzetif, Вы заметили что ответа на Ваш вопрос так и нет, так как вопрос Вы задавали о другом.

Answer 1

[Николай]

У вас это и так строка, смело вставляйте.

Comments

[Pazzetif]

Проблема как я понял с ковычками у меня. Есть такой код:

<a href="" data-html="true" data-trigger="hover" data-toggle="popover" data-content="<div class='hero-footnote'>
                        <img src='images/hero/sniper.svg' alt='sniper'>
                        <div class='hero-footnote__desc'>
                            <h3>Sniper</h3>
                            <p>Дальний бой</p>
                            <span>Carry — Nuker — Mider</span>
                        </div>
                    </div>"><img src="images/hero/sniper.svg" style="width: 26px; height: 15px; margin-top: 0; margin-right: 4px" alt="">Sniper</a>

У меня в html используются и двойные и одинарные. PHPstorm их экранирует. И весь код получается нужно в кавычки тоже положить. Как это обойти?

[dsmaslov]

<a href="" data-html="true" data-trigger="hover" data-toggle="popover" data-content="<div class='hero-footnote'">
                        <img src='images/hero/sniper.svg' alt='sniper'>
                        <div class='hero-footnote__desc'>
                            <h3>Sniper</h3>
                            <p>Дальний бой</p>
                            <span>Carry — Nuker — Mider</span>
                        </div>
                    </div>"><img src="images/hero/sniper.svg" style="width: 26px; height: 15px; margin-top: 0; margin-right: 4px" alt="">Sniper</a>

Pazzetif, так будет валидный ваш код, забыли кавычку в data-content