簡體   English   中英

Tinymce圖片上傳php插件之類的

[英]Tinymce image upload php plugin or something

我想上傳本地圖像並將其顯示在textarea中...是否有一些免費插件,或者您能解釋一下如何編寫一個插件?

我在以下代碼:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
tinymce.init({
    selector: "textarea#elm1",
    theme: "modern",
    //width: 600,
    height: 300,
    file_browser_callback: function(field_name, url, type, win) {
        if(type=='image') $('.slike').click();
    },
    plugins: [
         "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
         "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
         "save table contextmenu directionality emoticons template paste textcolor ",
   ],
   content_css: "css/content.css",
   toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l      ink image | print preview media fullpage | forecolor backcolor emoticons", 
   style_formats: [
        {title: 'Bold text', inline: 'b'},
        {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
        {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
        {title: 'Example 1', inline: 'span', classes: 'example1'},
        {title: 'Example 2', inline: 'span', classes: 'example2'},
        {title: 'Table styles'},
        {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
    ],
 }); 
</script>

這段代碼在正文中:

<form id='my_form' action='' method='POST' enctype="multipart/form-data">
        Title:<br/>
        <input type='text' name='title'/><br/><br/>
        Content:<br/>
         <textarea id="elm1" name="area"></textarea>        
        <br/>
        <input class='slike' name="image[]" multiple="multiple" type="file">
        <input type='submit' name='submit' value='Ok!'/>
    </form>

幾周前我遇到了同樣的問題。

首先,非常重要的一點是要注意tinymce文本區域將顯示圖像和元素,就像Web瀏覽器一樣,因此必須為href屬性圖像標簽(外部發布的URL或本地URL)輸入正確的路徑。

一旦確定了url,就將更改配置,以避免tinyMce控件從代碼中刪除圖像標簽。 我通過這種配置(使用絕對路徑)達到了這一點:

tinyMCE.init({
    ...
    //your initialization rules
    ...
    // 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',
    relative_urls              : false,
    remove_script_host         : false,
    convert_urls               : true,
    extended_valid_elements    : 'iframe[src|frameborder|style|scrolling|class|width|height|name|align]'
    });

希望這段代碼對您有幫助!!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM