Question

我在这个令人敬畏的社区里一直在阅读很多问题和答案。有些人真的为我节省了“编写尝试和错误”的时间。谢谢你。

现在我的问题：我正在定制在我的网络服务器上运行的tinyMCE 4.2.5。我希望有一个自定义文件浏览器，我上传并选择要插入编辑器的文件。但可能有些东西不起作用。这些是我的代码片段：

编辑器启动（editor.php）

<script type="text/javascript">
$(document).ready(function() { 
    tinyMCE.init({
       theme: "modern",
       width: 800,
       height: 500,
       selector: 'textarea.editor',
       plugins: "colorpicker fullscreen hr image imagetools link lists searchreplace textcolor textpattern wordcount youtube vimeo imgdrop",
       toolbar1: "undo redo | cut copy paste searchreplace | bold italic underline strikethrough | link image | fullscreen | youtube vimeo | imgdrop",
       toolbar2: "formatselect fontsizeselect | alignleft aligncenter alignright alignjustify | hr bullist numlist outdent indent blockquote",
       menubar: false
    });  
});
</script>
<form method="post" action="draft.php">
<label>Title</label><input type="text" name="title" value="<?php if(isset($title)) { echo $title; }?>" />
<label>Author</label><input type="text" name="author" value="<?php if(isset($author)) { echo $author; }?>" />
<input type="hidden" name="id" value="<?php if(isset($id)) { echo $id; }?>" />
<textarea name="content" class="editor"><?php if(isset($content)) { echo $content; }?></textarea>
<input type="button" value="Klick" onClick="this.form.submit();" />
</form>

自定义文件浏览器（dropzone.php）

<script type="text/javascript">
$(document).ready(function() {

$('#pix a').bind('click', function(){
      var img_url = $(this).attr('data-img-url');
      tinymce.activeEditor.selection.setContent('<strong>Some contents</strong>');
      top.tinymce.activeEditor.windowManager.close();
});

});
</script>
<div id="pix">
<?php
$response_type = 'php';
$pic_dir = $path;
include('../pixlie.php');

foreach ($pixlie_table_file as $picture){ 
    $picture['link_get'] = str_replace("?q=","?q=".$pic_dir, $picture['link_get']);?>
        <a href="" data-img-url="<?php echo $path."/".$picture['name'].$picture['extension']; ?>">
        <img src="<?php echo $pixlie_table_env['path_pixlie'].$picture['link_get']; ?>_x<?php echo $picture['extension']; ?>" 
        alt="<?php echo $picture['name']; ?>" />
        </a>
<?php } ?>
</div>

tinyMCE插件（imgdrop）

tinymce.PluginManager.add('imgdrop', function(editor, url) {
    editor.addButton('imgdrop', {
        text: 'PIX',
        tooltip: 'Insert Pictures',
        icon: false,
        onclick: function() {
            editor.windowManager.open({
                title: 'Insert Pictures',
                url: 'upload/upload.php',
                width: 700,
                height: 600
            });
        }
    });
});

想法是打开插件（imgdrop）作为模式弹出窗口，然后通过单击选择要插入的文件。（然后窗口应该关闭，数据插入编辑器放在编辑器中的位置）。

我希望有人可以在这里帮助我解决这个问题。我已经尝试了几天，但似乎没有任何工作。不用说我不是编码专家。

干杯添

如何在tinyMCE 4.2.5中实现自定义文件浏览器

0 个答案: