如何将复杂的 HTML 代码添加到 JavaScript 中的字符串？答案

【问题标题】：How to add complicated HTML code to string in JavaScript?如何将复杂的 HTML 代码添加到 JavaScript 中的字符串？
【发布时间】：2020-02-23 21:37:34
【问题描述】：

我正在尝试通过 JavaScript 将 HTML 元素添加到现有元素。它适用于简单的 HTML 代码，但特殊字符出现错误。

错误：“ 编译器错误消息：CS1012：字符文字中的字符过多 "

将某些字符串引号更改为双引号没有帮助，如果我更改下一个错误出现：

" 解析器错误消息：未终止的字符串文字。以引号 (") 开头的字符串必须在行尾之前终止。但是，以 @ 和引号 (@") 开头的字符串可以跨越多行。在字符串文字中关闭 HTML 标记可能会触发此错误消息。 "

这是我的 mvc asp.net web 应用程序。

代码：

 i++;
 var html = '<div> <p>Gold</p>' +
            '@Html.TextBoxFor(model => model.jGold[' + i + '].gram, new { @class = "form-control", @placeholder = "Gold Gram" })' 
            '</div>';
$('#dynamic_container').append(html);

有没有办法将该字符串添加到变量中？

【问题讨论】：

如果你试图让 JavaScript 将 C# 代码添加到 RazorPage，它对你不起作用。一旦 JavaScript 执行完毕，RazorPage 就会执行完毕，并且不会在事后重新评估。
将代码添加到 HTML 并隐藏，直到你需要它
@Html.TextBoxFor(model => model.jGold[' + i + '] - 这就像在说，“我给住在 1200 英里外的朋友寄了一张 CD，当他们把它放在他们的 CD 播放器中时，我听不见了。” @Html 和 you 住在 C#ville。 i 住在很远的地方 javascriptopia.
@mplungjan 我需要动态添加它们

标签： javascript html asp.net razor

【解决方案1】：

@Html 是 razor 语法，它是由 .Net 编译的，但 javascript 不理解 razor 语法。为了达到预期的输出，您可以转换您的代码

来自

i++;
 var html = '<div> <p>Gold</p>' +
            '@Html.TextBoxFor(model => model.jGold[' + i + '].gram, new { @class = "form-control", @placeholder = "Gold Gram" })' 
            '</div>';
$('#dynamic_container').append(html);

收件人

i++
 var html = '<div> <p>Gold</p>' +
        '<input type="text" name="jGold[' + i + ']" class="form-control" placeholder="Gold Gram" />'+
        '</div>';
$('#dynamic_container').append(html);

上面的代码将做同样的工作

【讨论】：

【解决方案2】：

使用下面等效于 javascript 的 printf

让 num = 10; console.log(`这是 ${num} 次！`);

【讨论】：