IE 7 jQuery .append функциональность не работает

Question

У меня есть следующий фрагмент кода:

$("#QnAList").append("<div id=qdiv" + i + " class=divBase>
<span id='" + i + "'>" + msg.d[i].QuestionText + "</span>
<span id='display'" + i + "'>" + answerDisplay + 
"<span class='triage'> </span></div>");

msg.d[i].QuestionText это проблема, которая у меня возникла. В FF он отображает текст отлично. В IE7 отображается только значение answerDisplay, представляющее собой элементы ввода, которые я записываю на лету.

Когда я вынимаю все элементы div и span и добавляю <p></p>, отображается msg.d[i].QuestionText со значением answerDisplay. Может кто-нибудь увидеть что-то, что я делаю неправильно с этим фрагментом кода?

Спасибо!

Answer 1

Здесь есть проблема:

<span id='display'" + i + "'>" + answerDisplay + 

Это приводит к:

<span id='display'nn'>text</span>

Так что дополнительная кавычка обязательно вызовет проблемы, она должна быть:

<span id='display" + i + "'>" + answerDisplay + 

Также рассмотрите возможность добавления кавычек к свойствам на внешнем <div> или создания элементов в виде узлов DOM.

Answer 2

Вы забыли закрыть промежуток, у вас есть случаи, когда кавычки не работают должным образом и т. Д.

Это потому, что трудно отслеживать, что происходит в длинной строке.

Это может быть больше строк, но это понятнее, поэтому вы будете делать меньше ошибок:

  // create empty spans and divs
var span1 = $("<span>");
var span2 = $("<span>");
var span3 = ${"<span>");
var div   = $("<div>");

  // Add html and attributes you need

span1.attr("id", i);
span1.html(msg.d[i].QuestionText);

span2.attr("id", "display" + i);
span2.html(answerDisplay)

span3.attr("class", "triage");

div.attr("id", "qdiv" + i);
div.attr("class", "divbase");

  // Add everything to the DOM
div.append(span1);
div.append(span2);
div.append(span3);
$("#QnAList").append(div);

Я думаю, что использование $("</div>") на самом деле быстрее, но я использовал форму выше для удобства чтения.

Answer 3

Тупой ответ на дурацкий вопрос:)

У меня не было конечного тега span здесь:

...<span id='display'" + i + "'>" + answerDisplay + 
"<span class='triage'> </span></div>");

Спасибо всем, кто посмотрел на него.

Спасибо Нику Крейверу, который помог мне отладить его.