Insert javascript in jQuery

Question

Insert javascript in jQuery

Navigation

#1 by (4 votes)
#2 by (0 votes)

1

Why not put javascript in jQuery? If I put it in "straight line" it works, if I put it indented, to make it easier to edit later, it no longer works. Why?

WITHOUT FORMATTING, IT WORKS:

$j('<div class="filters"> <div class="title title--sm lucas"><span>FILTROS</span></div> <div class="filters__list"> <div class="filters__filter cor "> <div class="filters__name">Cor </div> <ul class="ul--0"> <li class="li--0"> <a href="http://roupasatacado.dev.bizcommerce.com.br/roupas-de-academia?cor=73" title="Amarelo" class="a--0"> <span class="label">Amarelo</span> </a> </li> <li class="li--0"> <a href="http://roupasatacado.dev.bizcommerce.com.br/roupas-de-academia?cor=74" title="Azul" class="a--0"> <span class="label">Azul</span> </a> </li> <li class="li--0"> <a href="http://roupasatacado.dev.bizcommerce.com.br/roupas-de-academia?cor=76" title="Branco" class="a--0"> <span class="label">Branco</span> </a> </li> </ul> </div> </div> </div>').insertAfter('main.col-main');

WITH FORMATTING, DOES NOT WORK:

$j('<div class="filters">
   <div class="title title--sm lucas"><span>FILTROS</span></div>
   <div class="filters__list">
      <div class="filters__filter cor ">
         <div class="filters__name">Cor </div>
         <ul class="ul--0">
            <li class="li--0">
               <a href="http://roupasatacado.dev.bizcommerce.com.br/roupas-de-academia?cor=73" title="Amarelo" class="a--0">
               <span class="label">Amarelo</span>
               </a>
            </li>
            <li class="li--0">
               <a href="http://roupasatacado.dev.bizcommerce.com.br/roupas-de-academia?cor=74" title="Azul" class="a--0">
               <span class="label">Azul</span>
               </a>
            </li>
            <li class="li--0">
               <a href="http://roupasatacado.dev.bizcommerce.com.br/roupas-de-academia?cor=76" title="Branco" class="a--0">
               <span class="label">Branco</span>
               </a>
            </li>
         </ul>
      </div>
   </div>
</div>').insertAfter('main.col-main');

javascript jquery

asked by anonymous 24.05.2017 / 16:08

2 answers

0

Another way to insert multi-line text is template strings ES6. To declare a template string it is necessary to enclose the text with ciphers, like this:

'<div class="filters">
 <div class="title title--sm lucas"><span>FILTROS</span></div>
'

In this way dispense the + signal to concatenate.

To use it the browser needs to be compatible with this feature or use some transpiler, such as Babel .

31.05.2017 / 13:49

Add values with jquery, string to number Create an executable [closed]

score 4 · Accepted Answer

Because from the moment that is a new line is a new statement, in this case you need to concatenate the lines to be valid as only one statement:

$j('<div class="filters">' +
   '<div class="title title--sm lucas"><span>FILTROS</span></div>' +
   '<div class="filters__list">').insertAfter('main.col-main');

I've put only part of the code to clarify the problem.