xheditor文本编辑器的简单实用介绍

简介: 一、下载最新的xheditor文件包:http://download.csdn.net/source/3574826二、在aspx页面同目录下,放置一个upload.
一、下载最新的xheditor文件包: http://download.csdn.net/source/3574826

二、在aspx页面同目录下,放置一个upload.aspx(单页面模型)文件
<%@ Page Language="C#" AutoEventWireup="true" CodePage="65001" %>
<%@ Import namespace="System" %>
<%@ Import namespace="System.Collections" %>
<%@ Import namespace="System.Configuration" %>
<%@ Import namespace="System.Data" %>
<%@ Import namespace="System.Web" %>
<%@ Import namespace="System.Web.Security" %>
<%@ Import namespace="System.Web.UI" %>
<%@ Import namespace="System.Web.UI.HtmlControls" %>
<%@ Import namespace="System.Web.UI.WebControls" %>
<%@ Import namespace="System.Web.UI.WebControls.WebParts" %>

<script runat="server">
    /*
 * upload demo for c# .net 2.0
 *
 * @requires xhEditor
 * @author Jediwolf<jediwolf@gmail.com>
 * @licence LGPL(http://www.opensource.org/licenses/lgpl-license.php)
 *
 * @Version: 0.1.3 (build 100504)
 *
 * 注1:本程序仅为演示用,请您务必根据自己需求进行相应修改,或者重开发
 * 注2:本程序将HTML5上传与普通POST上传转换为byte类型统一处理
 *
 */

protected void Page_Load(object sender, EventArgs e)
{
    Response.Charset = "UTF-8";

    // 初始化一大堆变量
    string inputname = "filedata";//表单文件域name
    string attachdir ="../upload";     // 上传文件保存路径,结尾不要带/
    int dirtype = 1;                 // 1:按天存入目录 2:按月存入目录 3:按扩展名存目录  建议使用按天存
    int maxattachsize = 2097152;     // 最大上传大小,默认是2M
    string upext = "txt,rar,zip,jpg,jpeg,gif,png,swf,wmv,avi,wma,mp3,mid";    // 上传扩展名
    int msgtype = 2;                 //返回上传参数的格式:1,只返回url,2,返回参数数组
    string immediate = Request.QueryString["immediate"];//立即上传模式,仅为演示用
    byte[] file;                     // 统一转换为byte数组处理
    string localname = "";
    string disposition = Request.ServerVariables["HTTP_CONTENT_DISPOSITION"];

    string err = "";
    string msg = "''";
    
    if (disposition != null)
    {
        // HTML5上传
        file = Request.BinaryRead(Request.TotalBytes);
        localname = Regex.Match(disposition, "filename=\"(.+?)\"").Groups[1].Value;// 读取原始文件名
    }
    else
    {        
        HttpFileCollection filecollection = Request.Files;
        HttpPostedFile postedfile = filecollection.Get(inputname);

        // 读取原始文件名
        localname = postedfile.FileName;
        // 初始化byte长度.
        file = new Byte[postedfile.ContentLength];
        
        // 转换为byte类型
        System.IO.Stream stream = postedfile.InputStream;
        stream.Read(file, 0, postedfile.ContentLength);
        stream.Close();

        filecollection = null;
    }
    
    if (file.Length == 0)err = "无数据提交";
    else
    {
        if (file.Length > maxattachsize)err = "文件大小超过" + maxattachsize + "字节";
        else
        {
            string attach_dir, attach_subdir, filename, extension, target;

            // 取上载文件后缀名
            extension = GetFileExt(localname);
            
            if (("," + upext + ",").IndexOf("," + extension + ",") < 0)err = "上传文件扩展名必需为:" + upext;
            else
            {
                switch (dirtype)
                {
                    case 2:
                        attach_subdir = "month_" + DateTime.Now.ToString("yyMM");
                        break;
                    case 3:
                        attach_subdir = "ext_" + extension;
                        break;
                    default:
                        attach_subdir = "day_" + DateTime.Now.ToString("yyMMdd");
                        break;
                }
                attach_dir = attachdir + "/" + attach_subdir + "/";

                // 生成随机文件名
                Random random = new Random(DateTime.Now.Millisecond);
                filename = DateTime.Now.ToString("yyyyMMddhhmmss") + random.Next(10000) + "." + extension;

                target = attach_dir + filename;
                try
                {
                    CreateFolder(Server.MapPath(attach_dir));

                    System.IO.FileStream fs = new System.IO.FileStream(Server.MapPath(target), System.IO.FileMode.Create, System.IO.FileAccess.Write);
                    fs.Write(file, 0, file.Length);
                    fs.Flush();
                    fs.Close();
                }
                catch (Exception ex)
                {
                    err = ex.Message.ToString();
                }

                // 立即模式判断
                if (immediate == "1") target = "!" + target;
                target=jsonString(target);
                if(msgtype==1)msg = "'"+target+"'";
                else msg = "{'url':'" + target + "','localname':'" + jsonString(localname) + "','id':'1'}";
            }
        }
    }

    file = null;
    
    Response.Write("{'err':'" + jsonString(err) + "','msg':" + msg + "}");
}


string jsonString(string str)
{
    str = str.Replace("\\", "\\\\");
    str = str.Replace("/", "\\/");
    str = str.Replace("'", "\\'");
    return str;
}


string GetFileExt(string FullPath)
{
    if (FullPath != "")return FullPath.Substring(FullPath.LastIndexOf('.') + 1).ToLower();
    else return "";
}

void CreateFolder(string FolderPath)
{
    if (!System.IO.Directory.Exists(FolderPath))System.IO.Directory.CreateDirectory(FolderPath);
}
    
</script>




三、在需要使用文本编辑器的页面aspx中添加下载的xheditor文件中包含的js,具体如下:

在<head></head>标签内,增加如下内容:

  
<script src="../Scripts/xheditor-1.1.9/jquery/jquery-1.4.2.min.js" type="text/javascript"></script>

    <script src="../Scripts/xheditor-1.1.9/xheditor_plugins/ubb.min.js" type="text/javascript"></script>

    <script src="../Scripts/xheditor-1.1.9/xheditor-1.1.9-zh-cn.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(function() {
            $('#tbtmpContent').xheditor({
                upLinkUrl: "upload.aspx", upLinkExt: "zip,rar,txt",
                upImgUrl: "upload.aspx", upImgExt: "jpg,jpeg,gif,png,bmp",
                upFlashUrl: "upload.aspx", upFlashExt: "swf",
                upMediaUrl: "upload.aspx", upMediaExt: "wmv,avi,wma,mp3,mid",
                shortcuts: { 'ctrl+enter': submitForm }
            });
        });
        function submitForm() { $('#form1').submit(); }
    </script>




在form内添加一个Mode为MultiLine的文本控件,注意这个ID和上面jquery函数的那个名称。

 
<asp:TextBox ID="tbtmpContent" TextMode="MultiLine" BorderWidth="0" runat="server"  Width="100%" CssClass="inputc" Height="250px"></asp:TextBox>






相关文章
|
小程序
小程序-uniapp:实现锚点连接/锚点跳转
小程序-uniapp:实现锚点连接/锚点跳转
1175 0
|
API
uniapp使用u-checkbox
uniapp使用u-checkbox
919 1
|
Android开发 iOS开发 MacOS
APP备案公钥、证书MD5指纹/签名MD5值获取最简单方法
APP备案公钥、证书MD5指纹/签名MD5值获取方法,Android安卓平台、Windows平台、macOS平台,三个平台获取方法, Android平台使用 APP备案助手,各大安卓应用市场搜索 APP备案助手 即可,Windows/macOS平台使用jadx-gui工具。
7017 2
|
9月前
|
传感器 人机交互 定位技术
XR交互技术趋势:6DoF追踪、手势识别、眼动跟踪……
XR交互技术与实时云渲染共同推动了虚拟现实和增强现实的沉浸式体验发展。XR交互技术通过6DoF追踪、手势追踪、眼动追踪等手段,提供更自然、精准的用户交互方式;而实时云渲染则利用云端计算能力,为终端设备呈现高质量、低延迟的复杂图形内容。两者结合,使用户在XR环境中获得更加真实、流畅的体验。未来,XR交互技术将向多模态、精细化方向发展,进一步提升用户的沉浸感和交互体验。
581 20
|
JavaScript 前端开发
JavaScript从二维数组抽取元素组成新数组的三种方法
JavaScript从二维数组抽取元素组成新数组的三种方法
|
开发工具
APP 备案公钥、签名 MD5、SHA-1、SHA-256获取方法
APP 备案公钥、签名 MD5、SHA-1、SHA-256获取方法
2130 0
|
JavaScript 索引
js 数组遍历方法详解(map、filter、find、findIndex、reduce)
js 数组遍历方法详解(map、filter、find、findIndex、reduce)
|
前端开发 JavaScript
【WEB前端】【报错解决】This request has been blocked; the content must be served over HTTPS.
【WEB前端】【报错解决】This request has been blocked; the content must be served over HTTPS.
2411 0
|
数据采集 自然语言处理 算法
推荐引擎—算法策略讲解2|学习笔记
快速学习推荐引擎—算法策略讲解2