Использование jQuery .append() для вставки div в ячейку таблицы

Я пытаюсь создать divs в таблице с помощью jQuery. Таблица представляет собой календарь с каждым <td>, имеющий идентификатор, который соответствует строкам даты в формате ISO. В приведенном ниже коде у меня проблема с линией добавления. Это ничего не добавляет к DOM. Я проверил значения tdID с идентификаторами для ячеек, и они действительно совпадают. Поэтому я уверен, что это не проблема. Может ли кто-нибудь обнаружить, где я, возможно, ошибся?Использование jQuery .append() для вставки div в ячейку таблицы

if (loopDate.between(past, future)) { 
    var tdID = loopDate.toISOString(); 
    $("#" + tdID).append("<div class=&quot Event &quot>" 
        + data.events[i].Est + "</div>"); 
}

Редактировать --- вот образец моего html. «D» - это символ, который я добавил к началу идентификатора, чтобы решить проблему, отмеченную @Matt Stauffer.

<td id="d2012-02-01T05:00:00.000Z">1</td>

источник

2012-01-24 hughesdan

существует ли #tdID в вашем HTML? (Независимо от сгенерированного tdID) – Kypros

Да. И я сравнил id в HTML с переменной tdID в моем цикле. Они совпадают. – hughesdan

Теперь, когда вы показали с редактированием того, что создало tdID, проверьте мой ответ ниже, и я надеюсь, что он исправит вашу проблему. – Kypros

Теперь, когда я вижу свой идентификатор, хотя он действует как именовании для атрибута ид как для HTML где:

ID и токены NAME должны начинаться с буквы ([A-Za-z]), за которой может следовать любое количество букв, цифр ([0-9]), дефис («-»), подчеркивание («_») colons (":") и периоды (".").

проблема в вашем случае заключается в использовании точек (.) И двоеточия (.), Как и при использовании селектора JQuery, точки (.) Интерпретируется как searching for a class or subclass и двоеточие (:) as searching for :first, :last etc

Чтобы решить вашу проблему, вы можете попробовать заменить эти символы с помощью undescores (_) или дефиса (-), что должно быть хорошо.

Вы можете проверить это over here at this jsFiddle

источник

2012-01-25 00:33:19 Kypros

Спасибо. Это действительно решение. +1, потому что вы его заработали! – hughesdan

Добро пожаловать. Рад, что я мог бы помочь. – Kypros

Не использовать &quot; вам нужен лексический ".
Вам нужно Javascript-escape строку литерала, написав \".

источник

2012-01-24 22:51:17 SLaks

Спасибо. Я исправлю это. Однако я не думаю, что это единственная проблема. У меня такая же проблема с вставкой «

hello world

.. – hughesdan

Вы используете спасся HTML сущности в функции дописывания, так что вам нужно изменить:

"<div class=&quot Event &quot>"

к:

"<div class='event'>"... 
// or 
"<div class=\"event\">"...

источник

2012-01-24 22:52:45 mrlee

В качестве альтернативы, вы можете использовать

var div = document.createElement('div'); 
$(div).addClass("Event"); 
$(div).append(data.events[i].Est); 
$("#" + tdID).append(div);

- намного более чистый тип кодирования ...

источник

2012-01-24 22:54:41

Спасибо. Это чище. +1 – hughesdan

ID не может начинаться с числа, и я считаю, что дата в формате ISO начнется с числа, поэтому вы используете недопустимые идентификаторы.

Кроме того, как уже упоминалось,

"<div class=&quot Event &quot>"

Должно быть

"<div class=\"Event\">"

источник

2012-01-24 22:54:56

Да, они начинаются с числа. Я просто применил быстрое исправление, добавив« d »в начало каждого идентификатора. еще не решен. +1 за то, что вы меня туда поделили. – hughesdan

if (loopDate.between(past, future)) { 
    var tdID = loopDate.toISOString(); 
    var tdDiv = document.createElement('div'); 
    tdDiv.addClass("Event"); 
    tdDiv.html(data.events[i].Est); 
    $("#" + tdID).html(tdDiv); 
}

источник

2012-01-24 23:33:20

Использование jQuery .append() для вставки div в ячейку таблицы

ответ

Смежные вопросы