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

Javascript 如何在tinyMCE 4.2.5中实现自定义文件浏览器,javascript,php,jquery,tinymce,tinymce-4,Javascript,Php,Jquery,Tinymce,Tinymce 4,我在这个很棒的社区里读了很多问题和答案。有些真的为我节省了数小时的“编码尝试和错误”。谢谢你 现在我的问题是: 我正在自定义在Web服务器上运行的tinyMCE 4.2.5。我想有一个自定义的文件浏览器,在这里我上传我的文件并选择要插入编辑器的文件。 但那里可能有些东西不起作用。以下是我的代码片段: 编辑器初始化(editor.php) 我们的想法是打开插件(imgdrop)作为一个模式弹出窗口,然后单击它来选择我想要插入的文件。(然后,窗口应关闭,并将插入插入符号所在位置的数据插入编辑器) 我

我在这个很棒的社区里读了很多问题和答案。有些真的为我节省了数小时的“编码尝试和错误”。谢谢你

现在我的问题是: 我正在自定义在Web服务器上运行的tinyMCE 4.2.5。我想有一个自定义的文件浏览器,在这里我上传我的文件并选择要插入编辑器的文件。 但那里可能有些东西不起作用。以下是我的代码片段:

编辑器初始化(editor.php)

我们的想法是打开插件(imgdrop)作为一个模式弹出窗口,然后单击它来选择我想要插入的文件。(然后,窗口应关闭,并将插入插入符号所在位置的数据插入编辑器)

我希望这里的任何人都能帮助我解决这个问题。我已经试了几天了,但似乎没有任何效果。 不用说,我不是一个编码专家

干杯 提姆

<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>
<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.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
            });
        }
    });
});