Question

无论如何，我正在使用MVC Razor，我想实现一个文本区域，用户可以在其中输入带有HTML格式的文本和一些字段（或文本块），当用户输入文本时，该文本将立即以格式化方式显示。

现在我有一个测试标签，我想显示输入的文本和文本区域，用户将在其中键入。该模型有两个字段：ID和Text。

<label id="test">There will appear typed text</label>
@Html.TextAreaFor(model => template.Text, new { @class = "span10", rows = 12, @onkeyup = "$('#test').text('testing');" })

现在，TextArea上的监听工作正常，并且正在测试＆＃34;在标签内。但是我希望它能够提供动态值，而且我还需要测试标签才能拥有动态ID，例如＆＃34; test_1＆＃34; （因为将有超过1对textare标签）。我试过这样的事情：

@Html.TextAreaFor(model => template.Text, new { @class = "span10", rows = 12, @onkeyup = "$('#test_@template.Id').text('@template.Text');" })

但这并没有奏效。所以，我有两个问题：

如何在@onkeyup中的html属性中传递模型字段ID和Text
我应该使用哪个容器而不是label来正确显示html代码。

Answer 1

1）这只是字符串连接

@Html.TextAreaFor(model => template.Text,
    new { @class = "span10", rows = 12,
    @onkeyup = "$('#test_" + @template.Id + "').text('" + @template.Text + "');" })

2）如果标签描述了文本区域

，那么标签似乎没问题

修改

既然你有jquery让我们放弃@onkeyup并且不引人注意地这样做

<div id="format"></div> @Html.TextAreaFor(model => template.Text, new { @class="span10", rows=12, id="code" }) <script> $(function() { $("#code").on("keyup", function(e) { var markup = $(this).val(); var markupDiv = $("<div></div>").html(markup); $("#format").empty().append(markupDiv.html()); }); }); </script>

我们使用内存中的div $("<div></div>")对标记进行编码，然后将其附加到div占位符。

jsFiddle

Answer 2

UPD。找到解决方案特别感谢Jason的帮助。

<div id="test-@template.Id">@Html.Raw(@template.Text)</div>
@Html.TextAreaFor(model => template.Text, new { @class = "span10", rows = 12, id = "textarea-" + @template.Id, @onkeyup = "$('#test-" + @template.Id + "').html(document.getElementById('textarea-" + @template.Id + "').value);" })

访问MVC中html属性中的模型字段

2 个答案: