如何使TinyMce wysiwyg不适合用户使用?

时间:2017-11-15 10:05:16

标签: php ajax tinymce wysiwyg

我有一个TinyMCE WYSIWYG编辑器,我将其发送到我的SQL并返回到同一页面。一个解决方案是创建另一个页面来检索信息,但我想如果可以在同一页面上创建想要的上下文,那么为什么要构建更多页面。节省一点空间,使其更紧凑。

在TinyMCE的网站上,我看到在ajax公式中有一个名为:Noneditable的函数。我试过但没有成功。不知何故,这是行不通的。之后,我尝试在编辑器内容中使用Noneditable创建一个div。很好解决你会说。问题是我的textarea之间有一些空间,其中调用TinyMCE和区域内的div。那个空间仍然是可编辑的,这使得不可编辑的div无用。

之后,我试图让jQuery魔术发生。但我无法建立与textarea的内容或内容的连接。还尝试使内容隐藏,这根本不是解决方案,但即使这样也行不通。

TinyCME Javascript

$(document).ready(function() {
   tinymce.init ({
      selector: '.add_body_structure',
      height: 1000,
      menubar: true,
      branding: false,
      toolbar: 'undo redo | styleselect bold italic forecolor backcolor fontselect 
      fontsizeselect | link | alignleft aligncenter alignright alignjustify 
      | outdent indent bullist numlist | removeformat | insert',
      plugins: 'print preview searchreplace autolink directionality visualblocks 
      visualchars fullscreen image link media mediaembed template  table 
      charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist 
      lists textcolor wordcount imagetools contextmenu colorpicker 
      textpattern help autoresize noneditable', 
      advlist_bullet_styles: 'square',
      advlist_number_styles: 'lower-alpha,lower-roman,upper-alpha,upper-roman',
      statusbar: false,
      browser_spellcheck: true,
      image_title: true,        
      automatic_uploads: true,
      media_live_embeds: true,
      noneditable_noneditable_class: "noEdit",
      contextmenu: true,
      relative_urls: false,
      remove_script_host: false,
      encoding: 'xml',
      invalid_elements: 'script, input, textarea, textfield, col, colgroup, 
      caption, dir, meta, object, select, option, source, title',
      fontsize_formats: '8pt 10pt 12pt 14pt 16pt 18pt 20pt 22pt 24pt 26pt 
      28pt 30pt 32pt 34pt 36pt 38pt 40pt', }); });

PHP页面

<?php foreach($viewmodel as $item) : ?>
<form method="post">
<div>
    <br><br><br><br>
    <textarea id="wysiwyg_frontpage" name="body" class="noEdit <?php if (isset($_SESSION['is_logged_in'])) : ?> add_body_structure <?php endif;?>" accept="video/mp4,video/x-m4v,video/*">
        <div class="noEdit">
        <?php echo html_entity_decode($item['body']);?>
        </div>
    </textarea>
    <input name="image" type="file" id="upload" class="hidden" onchange="">
</div>  
    <?php if (isset($_SESSION['is_logged_in'])) : ?> <input class="btn btn-primary" name="edit" value="Post" type="submit"></input><?php endif;?>
        </form>
<?php endforeach; ?>

当前页面的正文详细信息

<body id="tinymce" class="mce-content-body " data-id="wysiwyg_frontpage" contenteditable="true" style="overflow-y: hidden; padding-left: 1px; padding-right: 1px; padding-bottom: 50px;" data-mce-style="overflow-y: auto; padding-left: 1px; padding-right: 1px; padding-bottom: 50px;">
<div class="noEdit" contenteditable="false"><div class="noEdit" contenteditable="false"></div>

正如你在上面的html中看到的,你会看到2个noEdit类,那是因为textarea里面的div。它会在发布时发送一个额外的div。身体满足也是真实的,由TinyMCE设定,我无法改变或无法做到。

结论 当我这样设置时,如何进行可编辑或不可编辑。试着隐藏在会话后面,但首先我要解决这个问题。

如果需要更多信息,请询问。这3个是主要来源。

1 个答案:

答案 0 :(得分:0)

TinyMCE包含只读模式:

editor.setMode('readonly');

这是一个TinyMCE小提琴,显示了这一点:http://fiddle.tinymce.com/Hegaab