Question

我在我的MVC应用中使用TinyMCE Rich文本编辑器。我正在使用tinymce.js和tinymce.min.js。我面临的问题是我无法在我的应用中显示多个富文本编辑器。如果用户选择了一个编辑器，那么它工作正常，但如果进行了多次选择，则编辑器仅显示第一个编辑器，其余部分显示为普通文本区域。

请帮忙。

我的代码片段：

包含TinyMCE的包：

@using System.Web.Optimization
@Scripts.Render("~/bundles/tinymce")

的Global.asax：

 public static void RegisterBundles(BundleCollection bundles)
        {

            //Creating bundle for your js files
            bundles.Add(new ScriptBundle("~/bundles/tinymce").Include(
            "~/Scripts/tinymce/tiny_mce.js"));
        }

没有浏览器脚本错误。出现JSScript错误说： ＆＃34;对象不支持此属性或方法＆＃34;错误＆＃34;

Tiny_Mcefull.cshtml现在：

<script type="text/javascript">

    (function(){ 

        tinyMCE.init({

            // General options
            mode: "exact",
            elements: "@ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty)",
            theme: "advanced",
            height: "500",
            width: "790",
            verify_html : false,
            plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave",

            // Theme options
            theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
            theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
            theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
            theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft,codehighlighting,netadvimage",
            theme_advanced_toolbar_location : "top",
            theme_advanced_toolbar_align : "left",
            theme_advanced_statusbar_location : "bottom",
            theme_advanced_resizing : false,

            // Example content CSS (should be your site CSS)
            //content_css : "css/content.css",
            content_css : '@Url.Content("~/Scripts/tinymce/css/content.css")',
            convert_urls : false,

            // Drop lists for link/image/media/template dialogs
            template_external_list_url : "lists/template_list.js",
            external_link_list_url : "lists/link_list.js",
            external_image_list_url : "lists/image_list.js",
            media_external_list_url : "lists/media_list.js"

        });

    })();

</script>

Answer 1

好吧，在你的布局中：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    @Styles.Render("~/Content/css")

    @Scripts.Render("~/bundles/tinymce")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/jqgrid")
</head>

现在不能说出原因，但我记得在Jquery之后插入TinyMCE非常重要。 TinyMCE模板：

<script type="text/javascript">

    (function(){ 

        tinyMCE.init({

            // General options
            mode: "exact",
            elements: "@ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty)",
            theme: "advanced",
            height: "500",
            width: "790",
            verify_html : false,
            plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave",

            // Theme options
            theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
            theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
            theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
            theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft,codehighlighting,netadvimage",
            theme_advanced_toolbar_location : "top",
            theme_advanced_toolbar_align : "left",
            theme_advanced_statusbar_location : "bottom",
            theme_advanced_resizing : false,

            // Example content CSS (should be your site CSS)
            //content_css : "css/content.css",
            content_css : "@Url.Content("~/Scripts/tinymce/css/content.css")",
            convert_urls : false,

            // Drop lists for link/image/media/template dialogs
            template_external_list_url : "lists/template_list.js",
            external_link_list_url : "lists/link_list.js",
            external_image_list_url : "lists/image_list.js",
            media_external_list_url : "lists/media_list.js",

        });

    })();

</script>

@Html.TextArea(string.Empty, /* Name suffix */
    ViewData.TemplateInfo.FormattedModelValue /* Initial value */
)

希望这对你有用

TinyMCE富文本编辑器不允许多个文本编辑器

1 个答案: