带有 mvc 的 tinymce 没有名为 tinymce-textarea 的选择器名称？

Question

我似乎无法获得我之前的为 TinyMCE 获得的输出。我正在使用 MVC，我的 HTML razor-view 如下所示。

TextAreaFor 是我的 TinyMCE。在浏览器中查看 HTML 时，我没有看到 #tinymce-textarea 的区域？所以我不确定如何将我的脚本绑定到它。

我想做的就是将 tinymce 文本区域输出到它下面的 div。

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<script type="text/javascript">
      tinymce.init({
      selector: "#tinymce-textarea",
      setup: function (editor) {
        editor.on('change', function (e) {
            var newVal = tinymce.get('tinymce-textarea').getContent();
          $('.text-mirror').html(newVal);
        });
      }
    });
</script>

@using (Html.BeginForm("Create", "Post", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>

        <br />
        <div class="editor-label">
            @Html.TextAreaFor(model => model.Description)
        </div>
        <div class="editor-field">
            @Html.ValidationMessageFor(model => model.Description)
        </div>
        <br />
        <div class="text-mirror">

        </div>

Answer 1

根据文档 selector 选项 'enables you to specify a CSS selector expression that will be used to find textareas you want to convert.' 在您的 html 中，您没有任何 ID 为 tinymce-textarea 的文本区域。您只需将此 ID 添加到您的 textartea html 属性

...
@Html.TextAreaFor(model => model.Description, new {Id = "tinymce-textarea"})

或者您可以使用由 MVC textarea 助手生成的标准 ID，在您的情况下是 Description:

...
tinymce.init({
  selector: "#Description",
  setup: function (editor) {
    editor.on('change', function (e) {
        var newVal = tinymce.get('Description').getContent();
      $('.text-mirror').html(newVal);
    });
  }
});

带有 mvc 的 tinymce 没有名为 tinymce-textarea 的选择器名称？

tinymce with mvc no selector name called tinymce-textarea?

html

javascript

asp.net-mvc

jquery

tinymce