Javascript и JQuery проблема с использованием функции .append () - PullRequest
Новая
       2

Javascript и JQuery проблема с использованием функции .append ()

0 голосов
/ 31 июля 2011

У меня проблемы с добавлением div с помощью функции .append из jQuery в Grails .gsp.Проблема в том, что div, который я пытаюсь добавить, является блоком звездного рейтинга RichUI, который программно записывается при использовании тега.Код следующий:

Код в Grails .gsp: 

var textToInsert = [];
textToInsert[1] = '<tr><td>';
textToInsert[2] = artistData.name;
textToInsert[3] = '</td><td><div id="artist2"><richui:rating dynamic="true" id="2" units="5" rating="0"  controller="rating" action="rate"/></div></td></tr>';

$j('#recommendedList').append(textToInsert.join(''));

И полученный HTML именно такой: 

var textToInsert = [];
                textToInsert[1] = '<tr><td>';
                textToInsert[2] = artistData.name;
                textToInsert[3] = '</td><td><div id="artist2"><div id='r3a44146338e7d18384c9233cb7f7bb82'>
<div class='ratingblock'>  
 <div id='unit_longr3a44146338e7d18384c9233cb7f7bb82'>
  <ul id='unit_ulr3a44146338e7d18384c9233cb7f7bb82' class='unit-rating' style='width: 150px'>
    <li id='r9cd7abbd875dc72e67c84180c5b41704' class='current-rating' style='width: 0px;'>Currently 0.0</li>
    <li><a href="/Ontourtest/rating/rate/2?rating=1" onclick="new Ajax.Updater('r3a44146338e7d18384c9233cb7f7bb82','/Ontourtest/rating/rate/2',{asynchronous:true,evalScripts:true,parameters:'rating=1'});return false;" class="r1-unit rater" title="1">1</a></li>
    <li><a href="/Ontourtest/rating/rate/2?rating=2" onclick="new Ajax.Updater('r3a44146338e7d18384c9233cb7f7bb82','/Ontourtest/rating/rate/2',{asynchronous:true,evalScripts:true,parameters:'rating=2'});return false;" class="r2-unit rater" title="2">2</a></li>
    <li><a href="/Ontourtest/rating/rate/2?rating=3" onclick="new Ajax.Updater('r3a44146338e7d18384c9233cb7f7bb82','/Ontourtest/rating/rate/2',{asynchronous:true,evalScripts:true,parameters:'rating=3'});return false;" class="r3-unit rater" title="3">3</a></li>
    <li><a href="/Ontourtest/rating/rate/2?rating=4" onclick="new Ajax.Updater('r3a44146338e7d18384c9233cb7f7bb82','/Ontourtest/rating/rate/2',{asynchronous:true,evalScripts:true,parameters:'rating=4'});return false;" class="r4-unit rater" title="4">4</a></li>
    <li><a href="/Ontourtest/rating/rate/2?rating=5" onclick="new Ajax.Updater('r3a44146338e7d18384c9233cb7f7bb82','/Ontourtest/rating/rate/2',{asynchronous:true,evalScripts:true,parameters:'rating=5'});return false;" class="r5-unit rater" title="5">5</a></li>
   </ul>
  </div>
 </div>
</div></div></td></tr>';

$j('#recommendedList').append(textToInsert.join(''));

Firebug выдает ошибку: отсутствует;перед утверждением textToInsert[3] = '</td><td><div ...='r3a44146338e7d18384c9233cb7f7bb82'>

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

Есть ли способпреодолеть эту проблему?Спасибо большое!

1 Ответ

0 голосов
/ 31 июля 2011

Что это означает, что в этой строке есть ошибка (и все последующие строки, я не копирую их все): 

textToInsert[3] = '</td><td><div id="artist2"><div id='r3a44146338e7d18384c9233cb7f7bb82'>

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

textToInsert[3] = '</td><td><div id="artist2"><div id="r3a44146338e7d18384c9233cb7f7bb82">'

Если вы хотите сохранить одинарные кавычки, вам нужно их избежать: 

textToInsert[3] = '</td><td><div id="artist2"><div id=\'r3a44146338e7d18384c9233cb7f7bb82\'>
...