Question

所以我正在为自己创建一个简单的CMS。显然我想使用Tinymce进行文本编辑。我试图在一个简单的视图中实现它，但它什么也没有返回。控制台中没有错误，但它不会加载Tinymce。

我遵循了这个简单的CI指南：

https://github.com/EllisLab/CodeIgniter/wiki/TinyMCE

所以这是我的简单观点：

<html>
<head>
<title>TEST</title>
<script type="text/javascript" src='<?php echo asset_url()."js/jquery.js" ?>'></script>
<script type="text/javascript" src='<?php echo asset_url()."js/tiny_mce/tiny_mce.js" ?>'>
    tinyMCE.init({
        theme : "advanced",
        mode : "textareas",
        plugins : "imagemanager,filemanager,insertdatetime,preview,emotions,visualchars,nonbreaking",
        theme_advanced_buttons1_add: 'insertimage,insertfile',
        theme_advanced_buttons2_add: 'separator,forecolor,backcolor',
        theme_advanced_buttons3_add: 'emotions,insertdate,inserttime,preview,visualchars,nonbreaking',
        theme_advanced_disable: "styleselect,formatselect,removeformat",
        plugin_insertdate_dateFormat : "%Y-%m-%d",
        plugin_insertdate_timeFormat : "%H:%M:%S",
        theme_advanced_toolbar_align : "left",
        theme_advanced_resize_horizontal : false,
        theme_advanced_resizing : true,
        apply_source_formatting : true,
        spellchecker_languages : "+English=en",
        extended_valid_elements :"img[src|border=0|alt|title|width|height|align|name],"
        +"a[href|target|name|title],"
        +"p,"
        invalid_elements: "table,span,tr,td,tbody,font"

    });
</script>

</head>
<body>
<textarea>
    text..
</textarea>
</body>
</html>

我现在看到的是标准的textarea，而不是Tinymce编辑器。由于控制台根本没有给我任何反馈，我在找不到问题的时候一点也不知道。

任何人都有这方面的经验吗？

Answer 1

使用此脚本更改textarea以获取tinymce：

$(document).ready(function() {
    tinymce.init({
            selector: "textarea",
            plugins: [
                "advlist autolink lists link image charmap print preview anchor",
                "searchreplace visualblocks code fullscreen",
                "insertdatetime media table contextmenu paste"
            ],
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | fontselect fontsizeselect",
            fontsize_formats: "8pt 10pt 12pt 14pt 18pt 24pt 36pt"
        });

    });

我希望它有所帮助

Answer 2

我添加了缺少的开始标记。现在试试。

<html>
<head>
<title>TEST</title>
<script type="text/javascript" src='<?php echo asset_url()."js/jquery.js" ?>'>  </script>
<script type="text/javascript" src='<?php echo asset_url()."js/tiny_mce/tiny_mce.js" ?>'>
<script>
    tinyMCE.init({
        theme : "advanced",
        mode : "textareas",
        plugins : "imagemanager,filemanager,insertdatetime,preview,emotions,visualchars,nonbreaking",
        theme_advanced_buttons1_add: 'insertimage,insertfile',
        theme_advanced_buttons2_add: 'separator,forecolor,backcolor',
        theme_advanced_buttons3_add: 'emotions,insertdate,inserttime,preview,visualchars,nonbreaking',
        theme_advanced_disable: "styleselect,formatselect,removeformat",
        plugin_insertdate_dateFormat : "%Y-%m-%d",
        plugin_insertdate_timeFormat : "%H:%M:%S",
        theme_advanced_toolbar_align : "left",
        theme_advanced_resize_horizontal : false,
        theme_advanced_resizing : true,
        apply_source_formatting : true,
        spellchecker_languages : "+English=en",
        extended_valid_elements :"img[src|border=0|alt|title|width|height|align|name],"
        +"a[href|target|name|title],"
        +"p,"
        invalid_elements: "table,span,tr,td,tbody,font"

    });
</script>

</head>
<body>
<textarea>
    text..
</textarea>
</body>
</html>

Answer 3

只需将此行添加到标题

<!-- WYSIWYG text editor -->
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<script>tinymce.init({ selector:'textarea' });</script>

在我的CodeIgniter应用程序中实现Tinymce

3 个答案: