zoukankan      html  css  js  c++  java
  • 一个JQUERY文件

    $(function () {
    
    
        jQuery.fn.extend({
    
            //options:[{id:xx,name:xxx},{id:xx,name:xxx}]
            //key:selectValue 选中项的id
            addOption: function (options, selectValue) {
    
                var strOption = "";
                var selected = "selected";
                if (selectValue == undefined || selectValue == "" || selectValue == null) {
                    for (var i = 0; i < options.length; i++) {
                        strOption += "<option value='" + options[i].id + "' ";
                        strOption += "  >";
                        strOption += options[i].name;
                        strOption += "</option>";
                    }
                }
                else {
                    for (var i = 0; i < options.length; i++) {
                        strOption += "<option value='" + options[i].id + "' ";
                        if (options[i].id == selectValue) {
                            strOption += selected;
                        }
                        strOption += "  >";
                        strOption += options[i].name;
                        strOption += "</option>";
                    }
                }
    
                $(this).html("");
                $(this).append(strOption).trigger("chosen:updated")
            },
    
    
            //用法:$("#up").upLoadFile($("#btnBrowse"), "Home/up", function (o) { alert(o) });
            //btnBrowse:浏览按钮 JQ对象
            //url:提交地址
            //callBack:回调函数
            upLoadFile: function (btnBrowse, url, callBack) {
    
                var self = $(this);
                var formHtml = "<iframe    name='xxxxxxxxxxx' style='display:none' ></iframe >";
                formHtml += "<form   action='" + url + "' method='post'  target='xxxxxxxxxxx' enctype='multipart/form-data' >";
                formHtml += "<input  type='file' name='file' />";
                formHtml += "</form>";
    
                self.append(formHtml);
                self.find("iframe").load(function (e) {
                    //服务端返回的数据
                    var res = $(this).contents().find("body").text();
                    //chrome 浏览在首次加载并不执行load里的代码
                    !res ? null : callBack(res);
                });
    
                var file = self.find(":file");
                file.on("change", function () { alert(this.value); self.find("form").submit(); });
                file.css("position", "fixed").css({
                    "left": btnBrowse.offset().left,
                    "top": btnBrowse.offset().top,
                    "width": btnBrowse.width(),
                    "height": btnBrowse.height(),
                    "opacity": 0
                });
                return self;
            }
    
    
        });
    
        $.extend({
    
            //分页
            //需要在目标容器上添加两个属性 
            //记录总数 data-paging-itemcount
            //当前页码 data-paging-index
            pager: function (options) {
                this._index = 1; // 当前页码, 从1开始
                this._pageSize = 20; // 每页显示记录数
                this._maxButtons = 5; // 显示的分页按钮数量
                this._itemCount = 0; // 记录总数
                this._pageCount = 0; // 总页数
                this._container = null;
                this._click = null;
    
                this._options = {
                    containerId: null,
                    maxPagingButtons: 5,
                    pageSize: 20,
                    queryPageIndexPara: "pageindex", //Url中页码的参数名称
                    className: {
                        current: 'active',
                        normal: 'normal'
                    },
                    click: null
                };
    
                this.init = function (options) {
                    this._initOptions(options);
                    if (typeof this._container != "undefined" && this._container != null) {
                        this._itemCount = parseInt(this._container.getAttribute("paging-itemcount"));
                        this._index = parseInt(this._container.getAttribute("paging-index"));
                        this._render();
                    }
                };
    
                /* 初始化Options
                */
                this._initOptions = function (options) {
                    if (options != null || options != undefined) {
                        this._options.containerId = options.containerId;
                        this._container = document.getElementById(this._options.containerId);
                        if (typeof options.maxPagingButtons != "undefined") {
                            this._maxButtons = options.maxPagingButtons;
                        }
                        if (typeof options.pageSize != "undefined") {
                            this._pageSize = options.pageSize;
                        }
                        if (typeof options.click != "undefined") {
                            this._click = options.click;
                        }
                    }
                };
    
                /* 内部方法.
                */
                this._onclick = function (index) {
                    if (typeof this._click == "function") {
                        this._click(index);
                    }
                };
    
                /* 在显示之前计算各种页码变量的值.
                */
                this._calculate = function () {
                    this._pageCount = parseInt(Math.ceil(this._itemCount / this._pageSize));
                    this._index = parseInt(this._index);
                    if (this._index > this._pageCount) {
                        this._index = this._pageCount;
                    }
                };
    
                /* 获取当前Url地址前缀,自动去除pageindex
                */
                this._getPreHref = function () {
                    var str = window.location.href.toLowerCase();
                    if (str.indexOf("?") > 0) {
                        var index = str.indexOf(this._options.queryPageIndexPara.toLocaleLowerCase());
                        if (index > 0) {
                            var preStr = str.substring(0, index - 1),
                                tailStr = str.substr(index + this._options.queryPageIndexPara.length, str.length - index - this._options.queryPageIndexPara.length);
                            var newIndex = tailStr.indexOf("&");
                            if (newIndex > 0) {
                                tailStr = tailStr.substr(newIndex, tailStr.length - 1);
                            }
                            else {
                                tailStr = "";
                            }
                            if (preStr.indexOf("?") >= 0) {
                                str = preStr + tailStr + "&" + this._options.queryPageIndexPara + "=";
                            }
                            else {
                                str = preStr + "?" + this._options.queryPageIndexPara + "=";
                            }
                        }
                        else {
                            str += "&" + this._options.queryPageIndexPara + "=";
                        }
                    }
                    else {
                        str += "?" + this._options.queryPageIndexPara + "=";
                    }
                    return str;
                };
    
                /* 渲染分页控件
                */
                this._render = function () {
                    var self = this;
                    var isLink = true;
                    if (self._click != null) {
                        isLink = false;
                    }
                    self._calculate();
                    var curHref = self._getPreHref();
                    var start, end;
                    start = Math.max(1, self._index - parseInt(self._maxButtons / 2));
                    end = Math.min(self._pageCount, start + self._maxButtons - 1);
                    start = Math.max(1, end - self._maxButtons + 1);
                    var str = [];
                    str.push("<ul class='pagination'>");
                    /*str.push('<span>共' + self._itemCount + '条记录</span>');*/
                    if (self._pageCount > 1) {
                        if (self._index != 1) {
                            if (isLink) {
                                str.push('<li class="' + self._options.className.normal + '" ><a href="' + curHref + '1"><span>首页</span></a></li>');
                                str.push('<li class="' + self._options.className.normal + '"><a href="' + curHref + (self._index - 1) + '"><span>上一页</span></a></li>');
                            }
                            else {
                                str.push('<li class="' + self._options.className.normal + '"><a href="javascript://1"><span>首页</span></a></li>');
                                str.push('<li class="' + self._options.className.normal + '"><a href="javascript://' + (self._index - 1) + '"><span>上一页</span></a></li>');
                            }
                        }
                    }
                    if (self._index > 3 && self._pageCount > self._maxButtons) {
                        str.push('<li><span>…</span></li>');
                    }
                    for (var i = start; i <= end; i++) {
                        if (i == self._index) {
                            str.push('<li class="' + self._options.className.current + '"><a href="javascript:void(0);" >' + i + '</a></li>');
                        } else {
                            if (isLink) {
                                str.push('<li class="' + self._options.className.normal + '"><a href="' + curHref + i + '"><span>' + i + '</span></a></li>');
                            }
                            else {
                                str.push('<li class="' + self._options.className.normal + '" ><a href="javascript://' + i + '"><span>' + i + '</span></a></li>');
                            }
                        }
                    }
                    if (self._pageCount > end) {
                        str.push('<li><span>…</span></li>');
                    }
                    if (self._pageCount > 1) {
                        if (self._index != self._pageCount) {
                            if (isLink) {
                                str.push('<li class="' + self._options.className.normal + '" ><a href="' + curHref + (self._index + 1) + '"><span>下一页</span></a></li>');
                                str.push('<li class="' + self._options.className.normal + '"><a href="' + curHref + self._pageCount + '"><span>尾页</span></a></li>');
                            }
                            else {
                                str.push('<li class="' + self._options.className.normal + '" ><a href="javascript://' + (self._index + 1) + '"><span>下一页</span></a></li>');
                                str.push('<li class="' + self._options.className.normal + '"><a href="javascript://' + self._pageCount + '"><span>尾页</span></a></li>');
                            }
                        }
                    }
                    str.push('<li><span>共' + self._pageCount + '页</span></li>');
                    str.push("</ul>");
                    self._container.innerHTML = str.join('');
                    this._renderLinkClick(self);
                };
    
                this._renderLinkClick = function (self) {
                    if (typeof this._click == "function") {
                        var linklist = self._container.getElementsByTagName('a');
                        for (var i = 0; i < linklist.length; i++) {
                            linklist[i].onclick = function () {
                                var pageNumber = this.getAttribute('href');
                                if (typeof pageNumber != "undefined") {
                                    pageNumber = parseInt(pageNumber.replace('javascript://', ''));
                                    self._onclick(pageNumber)
                                }
                                return false;
                            };
                        }
                    }
                };
    
                this.init(options);
    
            },
    
    
            //controller:控制器
            //tableAction:异步返回的table的路径
            //key:提交前处理函数
            //pageSize:页大小
            //parameters:提交参数  对象
            //callBack:成功返回table html 后执行的函数
            indexPageInit: function (controller, tableAction, key, pageSize, parameters, callBack) {
    
                var pIndex = 1;
    
                bindButton();
                getTableHtml(pIndex)
    
                $("#btnSearch").on("click", function () { getTableHtml(1) });
                $("#btnCreate").on("click", function () {
                    location.href = "/" + controller + "/Detail"
                });
    
                function bindButton() {
                    $(".btnEdit").on("click", function () {
                        var tr = $(this).parentsUntil("tr").parent();
                        var id = tr.find("." + key).text().trim();
                        location.href = "/" + controller + "/Detail?" + key + "=" + id;
    
                    });
                    $(".btnDelete").on("click", function () {
                        var o = this;
                        $.confirm("确定删除这个信息吗?", function (r) {
                            if (r) {
                                var tr = $(o).parentsUntil("tr").parent();
                                var id = tr.find("." + key).text().trim();
                                $.post("/" + controller + "/Delete?" + key + "=" + id, function (data) {
                                    if (data.Code == 1) {
                                        getTableHtml(pIndex)
                                    } else {
                                        $.alert(data.Data);
                                    }
                                })
                            }
                        })
                    });
                }
    
                function getTableHtml(pIndex) {
    
                    var data = { PageIndex: pIndex, PageSize: pageSize };
                    $.extend(data, parameters);
    
                    $.ajax({
                        url: "/" + controller + "/" + tableAction + "",
                        type: "get",
                        dataType: 'html',
                        data: data,
                        cache: false,
                        success: function (html) {
    
                            $("#asyncTable").html(html);
                            $("#pager-container").attr("paging-itemcount", $("#txtCount").val());
                            $("#itemcount").text($("#txtCount").val());
                            $("#pager-container").attr("paging-index", pIndex);
    
                            if (typeof callBack == "function") {
                                callBack();
                            }
                            bindButton();
                            $.pager({
                                pageSize: pageSize,
                                containerId: "pager-container",
                                click: function (index) {
                                    pIndex = index;
                                    getTableHtml(pIndex);
                                }
    
                            });
                        },
                        error: function (xhr, status, message) {
                        }
                    });
                }
            },
    
            //controller:控制器
            //key:主键
            //submitBefore:提交前处理函数
            detailPageInit: function (controller, key, submitBefore) {
    
                $("#btnSubmit").on("click", function () {
                    $(this).attr("disabled", true);
                    var isBreak = true;
                    $(".required").each(function () {
                        var v = $(this).val().trim();
                        if (v.length == 0) {
                            isBreak = false;
                            return;
                        }
                    })
                    if (!isBreak) {
                        $(this).attr("disabled", false);
                        $.alert("请输入完整信息");
                        return false;
                    }
    
    
                    var key = $("#txt" + key + "").val().trim();
                    if (0 == key) {
    
                        if ($("#btnPreviewImg").length != 0) {
                            var PreviewImgFile = $("#btnPreviewImg").val();
                            if (PreviewImgFile.length == 0) {
                                $(this).attr("disabled", false);
                                $.alert("请上传图片");
                                return false;
                            }
                        }
    
                        $("#Form").attr("action", "/" + controller + "/Create");
                    } else {
                        $("#Form").attr("action", "/" + controller + "/Updata");
                    }
    
                    if (typeof submitBefore == "function") {
                        submitBefore();
                    }
                    $("#Form").submit();
    
                })
                $("#btnPreviewImg").on("change", function () {
                    var files = !!this.files ? this.files : [];
                    if (!files.length || !window.FileReader) return;
                    if (files[0].type != "image/jpeg" || files[0].size > (1024 * 1024)) {
                        $("#divPreviewImg").css("background-image", "url()");
                        this.value = "";
                        $.alert("请上传小于1M的 JPG 文件");
                    } else {
                        var reader = new FileReader();
                        reader.readAsDataURL(files[0]);
                        reader.onloadend = function () {
                            $("#divPreviewImg").css("background-image", "url(" + this.result + ")");
                        }
                    }
    
    
                });
            },
    
            //message:标题
            //callback:回调函数
            //isAutoClose:是否自动关闭(假如回调函数不为null,该参数无效),
            //closeMsTime:关闭时间(毫秒)
            alert: function (message, callback, isAutoClose, closeMsTime) {
                bootbox.dialog({
                    message: "<span class='bigger-110'>" + message + "</span>",
                    buttons:
                    {
                        "关闭":
                        {
                            "label": "关闭",
                            "className": "btn-sm",
                            "callback": function () {
                                if (typeof callback == "function") {
                                    callback();
                                }
                            }
                        }
                    }
                });
                if (isAutoClose === false || typeof callback == "function") {
                    return;
                }
                var _time = isNaN(closeMsTime) ? 1500 : parseInt(closeMsTime);
                setTimeout(function () {
                    bootbox.hideAll();
                }, _time);
            },
    
            //message:标题
            //callback:回调函数-
            confirm: function (message, callback) {
                bootbox.dialog({
                    message: "<span class='bigger-110'>" + message + "</span>",
                    buttons:
                    {
                        "确定":
                        {
                            "label": "确定",
                            "className": "btn-sm btn-primary",
                            "callback": function () {
                                callback(true);
                            }
                        },
                        "取消":
                        {
                            "label": "取消",
                            "className": "btn-sm",
                            "callback": function () {
                                callback(false);
                            }
                        }
                    }
                });
            },
    
    
    
    
        });
    
    
    
    })
    View Code
  • 相关阅读:
    权重
    盒模型
    认识html标签
    CSS盒子模型
    行内元素和块级元素的区别
    搭建线路mvc实现接口获取数据库数据
    实现车辆信息编辑功能
    最近系统更新进度截图
    最近没写什么---更新下,在家没键盘就偷懒了
    基于web公交查询系统----管理员公交站点管理页面实现
  • 原文地址:https://www.cnblogs.com/gouyanfeng/p/4792245.html
Copyright © 2011-2022 走看看