几款常用的js 插件集锦

说明：笔者刚入行，写的都是初级内容，还请各位看官多多指教。

1. poshytip

用途：弹出提示框

　如何使用：

　　文件头中加入

　　实例

　　$(".showTips").poshytip({
content: function () { return $(this).text(); }
});

2. Uploadify

　　用途：附件上传

　　弊端：在IE下可以正常使用，在FF和Chrome中无法正常使用

　　　　　原因：浏览器通过flash组件实现文件上传的不同。IE 使用相同的session。而FF 打开一个新的连接，所以服务器将会认为该连接是未认证的用户。

　实例： var uploader = '@Url.Action("UploadAttachments")';
            $("#fileUploadCtrl").uploadify({
                buttonText: "请选择附件",
                width: 100,
                height: 23,
                swf: '@Url.Content("~/Content/uploadify/uploadify.swf")',
                uploader: uploader,
                formData: {
                    'masterId': $("#taskIds").val().trim(),
                    'type': 'task'
                },
                fileSizeLimit: 2048000,
                queueID: 'fileQueue',
                removeCompleted: false,
                multi: true,
                /*//在浏览窗口底部的文件类型下拉菜单中显示的文本
                fileTypeDesc: '支持的格式：',
                //允许上传的文件后缀
                fileTypeExts: '*.doc;*.docx',*/
                queueSizeLimit: 50,
                auto: false
            });

　　UploadAttachments 上传方法。

　　/// <summary>
        /// 附件上传
        /// </summary>
        /// <returns></returns>
        public ActionResult UploadAttachments()
        {
            Response.ContentType = "text/plain";
            Response.Charset = "utf-8";

            var file = Request.Files["Filedata"];

            if (file != null)
            {
                try
                {
                    string masterId = RequestHelper.GetParamsString("masterId");
                    string type = RequestHelper.GetParamsString("type");

                    string path = "";
                    if (type.Equals("task")) {
                        path = Definition.TASKATCH_PATH_PREFIX;
                    }else if(type.Equals("evaluation")){
                        path = Definition.EVALMATERIAL_PATH_PREFIX;
                    }
                    string dirPath = this.Server.MapPath(path);
                    string uploadPath = Path.Combine(dirPath, masterId);
                    string physicalPath = Path.Combine(uploadPath, file.FileName);
                    string relativePath = Path.Combine(path, masterId, file.FileName);

                    if (!Directory.Exists(uploadPath))
                    {
                        Directory.CreateDirectory(uploadPath);
                    }
                    file.SaveAs(physicalPath);

                    string[] Ids = masterId.Split(',');
                    foreach (var item in Ids)
                    {
                        var material = new Attachment()
                        {
                            Id = CommonTools.CreateUniqueKey(),
                            MasterId = item,
                            Path = relativePath,
                            Name = file.FileName,
                            ContentType = file.ContentType
                        };

                        _attachService.CreateAttachment(material);
                    }
                    //下面这句代码缺少的话，上传成功后上传队列的显示不会自动消失
                    Response.Write("1");
                }
                catch (Exception)
                {
                    Response.Write("0");
                }
            }
            else
            {
                Response.Write("0");
            }

            return new EmptyResult();
        }

　　解决方法：

　　在页面中保存session的值，并在服务器端处理前给session赋值。

　　代码：

　　在Global.asax中加入以下代码

　　protected void Application_BeginRequest(object sender, EventArgs e)
        {
            try {
                string session_param_name = "ASPSESSID";
                string session_cookie_name = "ASP.NET_SessionId";

                if (HttpContext.Current.Request.Form[session_param_name] != null)
                {
                    UpdateCookie(session_cookie_name, HttpContext.Current.Request.Form[session_param_name]);
                }
                else if (HttpContext.Current.Request.QueryString[session_param_name] != null)
                {
                    UpdateCookie(session_cookie_name, HttpContext.Current.Request.QueryString[session_param_name]);
                }
            }catch{

            }

            try
            {
                string auth_param_name = "AUTHID";
                string auth_cookie_name = FormsAuthentication.FormsCookieName;

                if (HttpContext.Current.Request.Form[auth_param_name] != null)
                {
                    UpdateCookie(auth_cookie_name, HttpContext.Current.Request.Form[auth_param_name]);
                }
                else if (HttpContext.Current.Request.QueryString[auth_param_name] != null)
                {
                    UpdateCookie(auth_cookie_name, HttpContext.Current.Request.QueryString[auth_param_name]);
                }
            }
            catch {

            }
        }

        private void UpdateCookie(string cookie_name, string cookie_value)
        {
            HttpCookie cookie = HttpContext.Current.Request.Cookies.Get(cookie_name);
            if (null == cookie)
            {
                cookie = new HttpCookie(cookie_name);
            }
            cookie.Value = cookie_value;
            HttpContext.Current.Request.Cookies.Set(cookie);
        }

　　在页面中加入

　　var AUTHID = "@(Request.Cookies[FormsAuthentication.FormsCookieName] == null ? string.Empty : Request.Cookies[FormsAuthentication.FormsCookieName].Value)";
var ASPSESSID = "@Session.SessionID";

3. ztree

　　用途：树形显示

4. WdatePicker

　　用途：日期显示

5. Tabs

　　用途：显示tabs

6. 验证validate

posted @ 2013-10-24 10:34 nosmall 阅读(533) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

几款常用的js 插件集锦

公告