zoukankan      html  css  js  c++  java

  • artEditor 富文本编辑器实际方法

    界面效果

    网址：https://github.com/baixuexiyang/artEditor

    引入文件：

    界面代码

      <!DOCTYPE html>
      <html lang="en">
      <head>
      <meta charset="UTF-8">
      <title>artEditor</title>
      <meta http-equiv="Access-Control-Allow-Origin" content="*">
      <!-- 强制让文档的宽度与设备的宽度保持1:1，并且文档最大的宽度比例是1.0，且不允许用户点击屏幕放大浏览 -->
      <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width, minimal-ui">
      <!-- iphone设备中的safari私有meta标签，它表示：允许全屏模式浏览 -->
      <meta name="apple-mobile-web-app-capable" content="yes">
      <link rel="stylesheet" href="example/css/style.css">
      </head>
      <body>
      <div style="320px;margin: 0 auto;">
      <div class="publish-article-title">
      <div class="title-tips">标题</div>
      <input type="text" id="title" class="w100" placeholder="文章标题">
      </div>
      <div class="publish-article-content">
      <div class="title-tips">正文</div>
      <input type="hidden" id="target">
      <div class="article-content" id="content">
      </div>
      <div class="footer-btn g-image-upload-box">
      <div class="upload-button">
      <span class="upload"><i class="upload-img"></i>插入图片</span>
      <input class="input-file" id="imageUpload" type="file" name="fileInput" capture="camera" accept="image/*" style="position:absolute;left:0;opacity:0;100%;">
      </div>
      </div>
      </div>
      </div>
      <script src="example/js/jquery-1.11.2.js"></script>
      <script src="artEditor.min.js"></script>
      <script src="example/js/index.js"></script>
      </body>
      </html>
     

    JS代码

    js:

    $('#content').artEditor({
    imgTar: '#imageUpload',
    limitSize: 5,   // 兆
    showServer: false, --此处要修改成true
    uploadUrl: '',--此处是上传图片的方法
    data: {},
    uploadField: 'image',
    placeholader: '<p>请输入文章正文内容</p>',
    validHtml: ["br"],
    uploadSuccess: function(res) {
      
          $("#demon").apppend("<img src="'+res.Date.Url+'">")   此处作为接收路径
            
    },
    uploadError: function(res) {
        // something error
        console.log(res);
    }
});




    function demon01(){


     获取到路径传到SQL里面
      Url= $('#demon').getValue();//详细内容 获取图片方法
    $.post('../../../路径位置'),{

       Url:    Url

    }

    }.function(data)
    {

    }


    估计很多人跟我差不多在传入CS层的时候会发现穿不进去，报错，等，或者是危险代码，
    这时候介意在CS层的上方加入
      [ValidateInput(false)]
    字段。就可以完成路径的保存了
  • 相关阅读:
    Spring aop 记录操作日志 Aspect 自定义注解
    winSCP连接FTP没有上传的权限
    Ubantu下安装FTP服务器
    设置ubantu的软件源地址
    Ubantu中安装sublime
    Ubantu 新建用户后没有生成对应文件夹
    Spring aop 记录操作日志 Aspect
    Java中如何获取spring中配置文件.properties中属性值
    java中获取ServletContext常见方法
    解决：“java.lang.IllegalArgumentException: error at ::0 can't find referenced pointcut myMethod”问题！
  • 原文地址：https://www.cnblogs.com/SDdemon/p/5869221.html
Copyright © 2011-2022 走看看