Добавить элемент списка с атрибутами в JQuery

Question

Я пытаюсь добавить элемент списка с атрибутами, но каждый раз, когда я его запускаю, я получаю сообщение об ошибке. Вы знакомы с ребятами, что такое синтаксическая проблема с моим кодом?

<div class="subway-map" data-columns="12" data-rows="10" data-cellSize="40" data-legendId="legend" data-textClass="text" data-gridNumbers="true" data-grid="true" data-lineWidth="8"> 
    <ul data-color="#ff4db2" data-label="jQuery Widgets">   
     <li data-coords="2,2"><a href="#">North Ave</a></li> 
     <li data-coords="4,2"><a href="#">South</a></li> 
     <li data-coords="6,2"><a href="#">West</a></li> 
    </ul> 

    <ul data-color="red" data-label="jQuery Interactions" class="map2></ul> 
</div>  

$(".subway-map").subwayMap({ debug: true }); 
$(".map2").append("<li data-coords="2,4">Test</li>"); // This is the issue 

Answer 1

Проблема в том, что вы разграничить строковый литерал в двойные кавычки и двойные кавычки внутри строки. Вы можете исправить это, используя одиночные кавычки вокруг самой строки. Попробуйте:

$(".map2").append('<li data-coords="2,4">Test</li>'); 

Альтернативно можно использовать двойные кавычки для обеих, но вам нужно бежать им \ в строке:

$(".map2").append("<li data-coords=\"2,4\">Test</li>"); 

Я хотел бы предложить вам взглянуть, чтобы использовать редактор с подсветка синтаксиса, поскольку это почти невозможно пропустить ошибки, подобные этому.

Answer 2

Как указано here:

Если вы используете одну форму цитаты в строке, вы можете использовать другие как буквальным.

Ваши внутренние двойные кавычки в append разбивают строку. заменить их в одинарные кавычки, чтобы правильно обращаться с этим:

$(".map2").append("<li data-coords='2,4'>Test</li>"); 

Answer 3

есть проблема с двойными кавычками, используйте одинарные кавычки instead.Try это:

$(".map2").append("<li data-coords='2,4'>Test</li>"); 

Answer 4

Вы " внутри " без надлежащего экранирования или конкатенации.

заменить

$(".map2").append("<li data-coords="2,4">Test</li>"); // <---This is the issue 

с

$(".map2").append('<li data-coords="2,4">Test</li>'); 

или

$(".map2").append("<li data-coords=\"2,4\">Test</li>"); 

Answer 5

Вы можете использовать этот

$(".map2").append("<li data-coords='2,4'>Test</li>"); 

ИЛИ

$(".map2").append('<li data-coords="2,4">Test</li>');