jQuery的追加在Chrome

與剃刀語法錯誤HTML我有這樣的javascript代碼：jQuery的追加在Chrome

var markup = '<tr id="newdo" class="odd"><td>' + @Html.DropDownList("does", new SelectList(Model.Does, "Id", "Name"),new { @class = "newDoSelect" }) + '</td><td class="small">'+ @Html.DropDownList("restriction", Model.Restrictions) + '</td><td>' + @Html.ListBox("doobjectives", new MultiSelectList(Model.AllObjectives, "Id", "Name"), new { Multiple = "multiple", @class="doobjectives" }) + '</td><td></td></tr>'; 
$('#doList tr:last').after(markup);

這是渲染代碼：

var markup = '<tr id="newdo" class="odd"><td>' + <select class="newDoSelect" id="does_3_" name="does[3]"><option value="319">A breath of fresh air..</option> 
<option value="176">Fix something that&#39;s broken today!</option> 
<option value="179">Get a physical &#39;high&#39; today!</option> 
<option value="150">It&#39;s OK to be unassertive sometimes!</option> 
<option value="169">Just &#39;let it wash&#39; today.</option> 
<option value="200">WOW!</option> 
<option value="233">Write something for 15 minutes.</option> 
<option value="104">You CAN be individually-centred: try it today.</option> 
<option value="111">You can be livelier: try this.</option> 
<option value="77">You can be more definite in how you are.</option> 
<option value="58">You don&#39;t always have to be unassertive!</option> 
</select> + '</td><td class="small">'+ <select id="restriction_3_" name="restriction[3]"><option value="negative">negative</option> 
<option value="neutral">neutral</option> 
<option value="positive">positive</option> 
</select> + '</td><td>' + <select Multiple="multiple" class="doobjectives" id="doobjectives_3_" multiple="multiple" name="doobjectives[3]"><option value="4">another test</option> 
<option value="24">testing objective 10</option> 
<option value="25">testing objective 11</option> 
<option value="13">testing objective 2</option> 
<option value="14">testing objective 3</option> 
<option value="15">testing objective 4</option> 
<option value="16">testing objective 5</option> 
<option value="17">testing objective 7</option> 
<option value="19">testing objective 8</option> 
<option value="18">testing objective 9</option> 
</select> + '</td><td></td></tr>'; 
$('#doList tr:last').after(markup);

它工作在Firefox不錯，但對鉻我米獲得在第一行這樣的錯誤：

未捕獲的SyntaxError：意外的標識符

任何線索？

來源

2012-07-25 joaoruimartins

很可能是有用的，包括由瀏覽器執行實際的Javascript而不是生成大部分HTML字符串的服務器端代碼。 – 2012-07-25 12:08:53

，不要串聯：

var markup = '<tr id="newdo" class="odd"><td>@Html.DropDownList("does", new SelectList(Model.Does, "Id", "Name"),new { @class = "newDoSelect" })</td><td class="small">@Html.DropDownList("restriction", Model.Restrictions)</td><td>@Html.ListBox("doobjectives", new MultiSelectList(Model.AllObjectives, "Id", "Name"), new { Multiple = "multiple", @class="doobjectives" })</td><td></td></tr>'; 
$('#doList tr:last').after(markup);

而且這似乎是一個可怕的方式，客戶端與服務器端腳本混合。爲什麼不直接在服務器上構建整個標記呢？

來源

2012-07-25 12:31:02

如果我沒有連接，它根本不起作用，即使在firefox中：Uncaught SyntaxError：意外的標記< – joaoruimartins 2012-07-25 12:34:48

因爲服務器端需要使用javascript編碼。如果服務器端標記生成危險字符，這將打破你的JavaScript。這就是爲什麼我在回答中提到這樣做並不是一個好主意。 – 2012-07-25 12:35:22

'<tr id="newdo" class="odd"><td>' + <select

是問題所在。你沒有生成一個字符串，但試圖連接字符串與HTML。所以Darin的權利 - 不要連接或連接到其他地方（「display：none」div）渲染的下拉內部html。

來源

2012-07-25 13:01:24 durilka

舊的，但發現了類似問題的不同解決方案。

爲了得到一個HTML出所產生的對象：

@Html.DropDownList("does", new SelectList(Model.Does, "Id", "Name"),new { @class = "newDoSelect" })

可以使用ToHtmlString()方法，像：

@Html.DropDownList("does", new SelectList(Model.Does, "Id", "Name"),new { @class = "newDoSelect" }).ToHtmlString()

來源

2016-09-01 19:16:49 PiotrWolkowski

jQuery的追加在Chrome

回答

相關問題