我的jquery.uploadifyv2.1.4 的使用。最后败给xheditor

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TechSupport.aspx.cs" Inherits="Web.Cpanel.TechSupport.TechSupport" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Uploadify</title>
    <link href="http://www.cnblogs.com/js/jquery.uploadify-v2.1.4/uploadify.css" type="text/css" rel="stylesheet" />

    <script type="text/javascript" src="http://www.cnblogs.com/js/jquery.uploadify-v2.1.4/jquery-1.4.2.min.js"></script>

    <script type="text/javascript" src="http://www.cnblogs.com/js/jquery.uploadify-v2.1.4/swfobject.js"></script>

    <script type="text/javascript" src="http://www.cnblogs.com/js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>
        <script src="http://www.cnblogs.com/js/common/validate.js" type="text/javascript"></script>
   <script src="http://www.cnblogs.com/js/common/identity.js" type="text/javascript" charset="gb2312"></script> 

    <link href="http://www.cnblogs.com/OpanelStyle/css/Style1.css" rel="stylesheet" type="text/css" />

    <script src="http://www.cnblogs.com/js/xheditor1.0.0/xheditor-zh-cn.min.js" type="text/javascript"></script>

    <script type="text/javascript">
  var myArray=new Array();//声明此数组来存放文件生成的路径
	$(function() {
				$('#custom_file_upload').uploadify({
   'uploader': 'http://www.cnblogs.com/js/jquery.uploadify-v2.1.4/uploadify.swf',
    'script': 'http://www.cnblogs.com/ComTool/UploadHandler.ashx',
    'cancelImg': 'http://www.cnblogs.com/js/jquery.uploadify-v2.1.4/cancel.png',
    'queueID': 'fileQueue',
    'folder': 'http://www.cnblogs.com/upload/TechSupport',
    'auto': false,
    'multi': true,
  'fileExt': '*.txt;*.rar;*.zip;*.jpg;*.jpeg;*.gif;*.png;*.swf;*.wmv;*.avi;*.wma;*.mp3;*.mid;*.doc;*.xls;*.ppt',
  'fileDesc': 'Files',
  'queueID': 'customqueue',
  'queueSizeLimit':3, 
  'simUploadLimit': 3,
  'removeCompleted' : false,
  'onSelectOnce': function(event,data) {
      $('#status-message').text(data.filesSelected + ' 文件正在等待上传…….');
    },
    'onComplete': function (evt, queueID, fileObj, response, data) {//onComplete表示文件上传成功事件调用函数   
     $('#files').append('<li>文件:' + (fileObj.name).substring((fileObj.name).lastIndexOf('/')) + '上传成功</li>'); //response 返回的数据 可以返回对应的JSON形式的所有的 已上传的文件的路径(存入SQL)
       alert("文件:" + fileObj.name + " 上传成功");    //名字是上传 的当前 的本机的文件名称
        //alert(queueID);//所在位置
        
       //被请求页面直接输出JSON格式字符串。用onComplete里的response获取。再用jQuery.parseJSON(response)格式化成JSON数据就可以啦。 
        alert(""+response);//调用传递回来的响应信息  
        myArray.push(response);
     $("#customqueue input").each(function(i){
     this.val()=i;
 });
    },
  'onAllComplete': function(event,data) {
  
      $('#status-message').text(data.filesUploaded + ' 文件上传完成!' + data.errors + '失误!');
    },
     'onQueueFull': function(event,data) {
     alert("上传数目已满. 最多上传3个文件!");
     },
    'onCancel': function(event,data) {
     //alert(data);//所在位置
      var dd=$('#custom_file_upload'+data).find('.fileName').text();
      var dd1=dd.substring(0,(dd).lastIndexOf(' ('))//所要删除的文件名称 这里注意(空格+‘(’)。有个空格字符
     // var dd2="文件:"+dd1+"上传成功";
      $("#files li").each(function(i){
      if($(this).text().indexOf(dd1)>=0){
   $(this).remove();
  for(var i=0;i<myArray.length;i++){
  if(myArray[i].indexOf(dd1)>=0){
  for(var j=i;j<myArray.length-1;j++){
  myArray[j]= myArray[j+1];
  }
  myArray.pop();
  } 
  }
   }
   
 });
       $('#status-message').text('选择上传的文件:');
    },//清除一个的时候.对应的循序清楚数组中的,后面的向前赋值。
   'onClearQueue': function(event,data) {
      $('#status-message').text('选择上传的文件:');
      $("ul").empty();
      myArray=null;
      
   }//清楚所有的时候
});
});		
    </script>

    <script type="text/javascript">
        jQuery(pageInit);
        var editor;
        function pageInit() {
            editor = jQuery('#Contents').xheditor({ upLinkUrl: "http://www.cnblogs.com/ComTool/Upload.aspx", upLinkExt: "zip,rar,txt,doc,xls,ppt", upImgUrl: "http://www.cnblogs.com/ComTool/Upload.aspx", upImgExt: "jpg,jpeg,gif,png", onUpload: insertUpload }, { tools: 'full', skin: 'vista', shortcuts: { 'ctrl+enter': submitForm },  810, height: 200, readonly: false });
        }
        function insertUpload(msg) {

        }

        function submitForm() { jQuery('#form1').submit(); }
    </script>

    <style type="text/css">
        #custom-demo .uploadifyQueueItem
        {
            background-color: #FFFFFF;
            border: none;
            border-bottom: 1px solid #E5E5E5;
            font: 11px Verdana, Geneva, sans-serif;
            height: 50px;
            margin-top: 0;
            padding: 10px;
             350px;
        }
        #custom-demo .uploadifyError
        {
            background-color: #FDE5DD !important;
            border: none !important;
            border-bottom: 1px solid #FBCBBC !important;
        }
        #custom-demo .uploadifyQueueItem .cancel
        {
            float: right;
        }
        #custom-demo .uploadifyQueue .completed
        {
            color: #C5C5C5;
        }
        #custom-demo .uploadifyProgress
        {
            background-color: #E5E5E5;
            margin-top: 10px;
             100%;
        }
        #custom-demo .uploadifyProgressBar
        {
            background-color: #0099FF;
            height: 3px;
             1px;
        }
        #custom-demo #customqueue
        {
            border: 1px solid #E5E5E5;
            height: 213px;
            margin-bottom: 10px;
             370px;
        }
    </style>

    <script src="TechSupport.js" type="text/javascript"></script>

</head>
<body>
    <form id="form1" runat="server">
    <input type="hidden" runat="server" id="oper" />
    <input id="loadNewsType" type="hidden" runat="server" />
    <div style="height: 590px;  100%; margin: 0 auto">
        <table cellspacing="0" cellpadding="0" border="0" style="height: 100%;  95%;">
            <tbody>
                <tr>
                    <td class="maintd" valign="top">
                        <table width="95%" class="maintable" cellpadding="0" cellspacing="1" border="1">
                            <tr>
                                <td class="title" colspan="4">
                                    <label id="NewsInfo" runat="server">
                                    </label>
                                    新增技术支持(带<font class="nf1">*</font>为必填)
                                </td>
                            </tr>
                            <td class="left" width="25%">
                                上传附件:<br>
                                最多上传5个文件
                            </td>
                            <td colspan="3">
                                <table>
                                    <tr>
                                        <td>
                                            <div id="custom-demo" style="margin-left: 60px">
                                                <div id="uploadFile">
                                                    <div id="status-message">
                                                        选择上传的文件:</div>
                                                    <div id="customqueue">
                                                    </div>
                                                    <input id="custom_file_upload" type="file" name="custom_file_upload" />
                                                    <p>
                                                        <a href="javascript:$('#custom_file_upload').uploadifyUpload()">上传</a>| <a href="javascript:$('#custom_file_upload').uploadifyClearQueue()">
                                                            取消上传</a>
                                                    </p>
                                                </div>
                                            </div>
                                        </td>
                                        <td>
                                            <div>
                                                <ul id="files">
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                            <tr>
                                <td class="left" width="25%">
                                    标题:
                                </td>
                                <td colspan="3">
                                    <input type="text" runat="server" id="Title" style=" 400px; margin-left: 20px"
                                        maxlength="50" /><font color="red">*</font>
                                </td>
                            </tr>
                            <tr>
                                <td class="left" width="15%">
                                    技术类型:
                                </td>
                                <td class="right">
                                    <select style="margin-left: 20px" id="TechType" name="TechType" runat="server">
                                    </select>
                                    <font color="red">*</font>
                                </td>
                                <td class="left" width="15%">
                                    是否置顶:
                                </td>
                                <td class="right">
                                    <input type="checkbox" id="checkboxValue" name="checkboxValue" runat="server" style="margin-left: 20px" />
                                </td>
                            </tr>
                            <tr>
                                <td class="center" colspan="4">
                                    <textarea rows="10" cols="70" id="Contents" name="Contents" class="dsn" runat="server"></textarea>
                                    <font color="red">*</font>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="4" align="center" class="bottom" style="height: 34px">
                                    <input type="button" id="btnSend" runat="server" value="提交" class="buttonBlue" onclick="Add()" />
                                    <input type="button" id="btnReset" runat="server" value="重置" class="buttonBlue" onclick="resetValue()" />
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    </form>
</body>
</html>
function resetValue()//清空表单
{                
    document.getElementById('Title').value=""; 
    document.getElementById('checkboxValue').checked=false;
  document.getElementById('TechType').value='-1';
 jQuery('#Contents').val("");//清空Textarea控件里面的值
}



function checkForm()//表单提交时验证
{


    if (isNull("Title")) {
        alert("标题不能为空!");
        document.getElementById("Title").focus();
        return false;
    }

    if (document.getElementById('TechType').value=='-1') {
        alert("请选择技术类型!");
        document.getElementById("TechType").focus();
        return false;
    }

        if (jQuery('#Contents').val().replace("<p> </p>", "") == "") {
     alert("请输入内容!");
        editor.focus();
        return false;
    }   
    return true;
}

function Add()//添加数据
{
    if (checkForm()) {
    var checkboxValue;
    var Address="";
        var Title = document.getElementById('Title').value;
        var TechType = document.getElementById('TechType').value;
        var Content = jQuery('#Contents').val().replace("<p> </p>", "");
        if(document.getElementById('checkboxValue').checked){
          checkboxValue = 1;//选择了 true
          }else{
          checkboxValue = 0;//未选择 false
        }

     for (var i in  myArray) {
            var keyi = myArray[i];
            if(i+1<myArray.length){
            Address +=  keyi + "," ; } //遍历并添加 。
            else{Address +=  keyi;}
 }
        var operationType = 2;
        $.ajax(
        {
            url: "TechSupportUtil.aspx",
            type: "POST",
            data: "operationType=" + operationType + "&Title=" + Title + "&TechType=" + TechType + "&Content=" + Content + "&checkboxValue=" + checkboxValue + "&Address=" + Address,
            dataType: 'json',
            timeout: 1000,
            error: function(data) { alert("出现错误!或者是您没有权限!"); },
            success: function(data) {
                alert(data.result);
            }
        });
    }
    else {
        return false;
    }
}

败给xheditor了。唉。这个插件真好使。自己拼死拼活的,最后又难看,又不通用。还好有一点点的收获。

加油吧。有点泄气。

using System;
using System.Collections;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.IO;
using System.Web.SessionState;

namespace Web.ComTool
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class UploadHandler : IHttpHandler, IRequiresSessionState
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            context.Response.Charset = "utf-8";
            HttpPostedFile file = context.Request.Files["Filedata"];//得到数据

            string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]) + "\\";//得到路径 还需要创建日期文件夹。
          // string  upext = "txt,rar,zip,jpg,jpeg,gif,png,swf,wmv,avi,wma,mp3,mid,doc,xls,ppt"; // 上传扩展名
         // string extension=GetFileExt(file.FileName);
          //if (("," + upext + ",").IndexOf("," + extension + ",") < 0)
          //{
          //    err = "上传文件扩展名必需为:" + upext;
          //}
          //else
          //{
              if (file != null)
              {
                
                      if (!Directory.Exists(uploadPath))
                      {
                          Directory.CreateDirectory(uploadPath);
                      }
                      string result = uploadPath + file.FileName;
                      file.SaveAs(result);

                      //下面这句代码缺少的话,上传成功后上传队列的显示不会自动消失    
                      //必须要有输出 作为 AJAX 的回调函数的参数。否则不响应 成功后的操作。
                      //一般用于传递 JSON数据,传递需要的当前文件的URL路径。用于数据库保存。
                     context.Response.Write(result);
                
              //}
              //else
              //{
              //    context.Response.Write("0");
              //}
          }

        }


        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
        ///// <summary>
        ///// 获取文件扩展名
        ///// </summary>
        ///// <param name="FullPath">完整路径</param>
        ///// <returns></returns>
        //string GetFileExt(string FullPath)
        //{
        //    if (FullPath != "")
        //    {
        //        return FullPath.Substring(FullPath.LastIndexOf('.') + 1).ToLower();
        //    }
        //    else
        //    {
        //        return "";
        //    }
        //}
    }
}
using System;
using System.Collections;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.IO;
using System.Web.SessionState;

namespace Web.ComTool
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class DeleteUploadHandler : IHttpHandler, IRequiresSessionState
    {

        public void ProcessRequest(HttpContext context)
        {
            //context.Response.ContentType = "text/plain";
            //context.Response.Write("Hello World");

            string filePath = context.Server.UrlDecode(context.Request["address"].ToString());
            //这里为了防止攻击。首先验证是否登录。再验证是否是指定文件夹下的文件。

            if (filePath.LastIndexOf("\\") > 0)//传递参数正确
            {
                string filename = filePath.Substring(filePath.LastIndexOf("\\")); //文件名 形式:(\\aa.txt)
                string fileroute = filePath.Substring(0, filePath.Length - filename.Length);//得到去除 filename之后的 字符
                string Dir = string.Format("{0}{1} ", System.Web.HttpContext.Current.Server.MapPath("/. "), System.Web.HttpContext.Current.Request.ApplicationPath);
                //DIR 当前URL地址 F://wrok//waterMananger//code//web
                string Direction = Dir.Substring(0, Dir.Length - 2) + "upload\\TechSupport";
                if (fileroute.Equals(Direction))
                {

                    if ((context.Session["AdminInfo"] != null))
                    {
                        if (File.Exists(filePath))
                        {
                            File.Delete(filePath);  //删除指定文件  --对应操作(取消)
                        }



                    }
                }
            }
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}
原文地址:https://www.cnblogs.com/mahaisong/p/2088098.html