最新消息: 新版网站上线了!!!

关于网站上传图片上传文件问题kindeditor

之前我也因这纠结了好久~~
现在推荐一种方法
不知道大家用不用kindeditor,里面有自带上传图片 上传文件的功能具体浏览编辑器
kindeditor\examples\index.html里面的

单独调用组件

  1. node.html (Node操作)
  2. uploadbutton.html (上传按钮)
  3. dialog.html (弹出框)
  4. colorpicker.html (取色器)
  5. file-manager.html (浏览服务器)
  6. image-dialog.html (上传图片弹出框)
  7. multi-image-dialog.html (批量上传弹出框)
  8. file-dialog.html (上传文件弹出框)
     

上传图片参考6
文件上传参考8
代码应用:
kindeditor自然是必须的 网上有好多下载
<link rel="stylesheet" href="../houtai/kindeditor/themes/default/default.css" />//编辑器样式必须调用
<script  src="../houtai/kindeditor/kindeditor.js"></script>//js 文件必须调用
  <script  src="../houtai/kindeditor/lang/zh_CN.js"></script>//语言包必须调用
        <!--上传图片-->必须调用
  <script>
   KindEditor.ready(function(K) {
    var editor = K.editor({
     allowFileManager : true
    });
    K('#image3').click(function() {
     editor.loadPlugin('image', function() {
      editor.plugin.imageDialog({
       showRemote : false,
       imageUrl : K('#url3').val(),
       clickFn : function(url, title, width, height, border, align) {
        K('#url3').val(url);
        editor.hideDialog();
       }
      });
     });
    });
   });
  </script>
        <!--上传附件-->
        <script>
   KindEditor.ready(function(K) {
    var editor = K.editor({
     allowFileManager : true
    });
    K('#insertfile').click(function() {
     editor.loadPlugin('insertfile', function() {
      editor.plugin.fileDialog({
       fileUrl : K('#url').val(),
       clickFn : function(url, title) {
        K('#url').val(url);
        editor.hideDialog();
       }
      });
     });
    });
   });
  </script>
  <input type="text" id="url3" name="pic"  size="50"/> <input type="button" id="image3" value="选择图片" />
<input type="text" id="url"  name="fujian" size="50" /> <input type="button" id="insertfile" value="选择文件" />
如果出现乱码 ,参考之前发不过的kindeditor乱码解决方法修改 
这样图片和文件会保存到文本编辑器的attached里面 

转载请注明:谷谷点程序 » 关于网站上传图片上传文件问题kindeditor