Добавление td в таблицу

#jquery

#jquery

Вопрос:

У меня возникла проблема с добавлением другой строки в мою существующую таблицу.

 $('.vv div:first-child').on('click', function(){
 $("tbody").append("<tr><td><input type="checkbox" class="selectall" /></td><td><span class="hdv dsp">Product</span><span class="hdv" contenteditable="true">--</span></td><td><span class="hdv dsp" contenteditable="true">Variation 1</span><span class="hdv" contenteditable="true">--</span></td><td><span class="hdv dsp" contenteditable="true">Variation 2</span><span class="hdv" contenteditable="true">--</span></td><td><span class="hdv dsp" contenteditable="true">Variation 3</span><span class="hdv" contenteditable="true">--</span></td><td><span class="hdv dsp" contenteditable="true">Variation 4</span><span class="hdv" contenteditable="true">--</span></td><td><span class="hdv dsp">Quantity</span><span class="hdv" contenteditable="true">1</span></td><td><span class="hdv dsp">Price</span><span class="hdv" contenteditable="true">$00.00</span></td></tr>");
  

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

Это таблица, к которой я пытаюсь ее прикрепить: https://jsfiddle.net/nwqmvo36/14 /

Комментарии:

1. Повторяющиеся двойные кавычки в append() содержимом вызывают синтаксическую ошибку. Вам нужно экранировать двойные кавычки или использовать одинарные кавычки для append() . например, $("#tbody").append(' ... '); .

Ответ №1:

https://jsfiddle.net/nwqmvo36/15/

Во-первых, это проблема

 .append("<tr><td><input type="checkbox"
  

Проблема в том, что ваши кавычки теперь больше не выстраиваются правильно. В этих ситуациях лучше всего использовать альтернативу ' , например:

 .append('<tr><td><input type="checkbox" ... all that other html ... ');
  

Кроме того, вы забыли указать ссылку $ (jQuery) в вашем jsFiddle. Пожалуйста, всегда проверяйте свою консоль на наличие ошибок, поскольку их должно было быть довольно просто устранить.