• 前端开发常用 JS 方法


    1,获取文件本地url,在上传之前预览

       /**
         * 获取图片嗯滴url,在上传之前预览
         * @param file 选择的图片文件
         * @returns {*} url
         */
        getFileLocationUrl: function (file) {
            var url = null;
            // 下面函数执行的效果是一样的,只是需要针对不同的浏览器执行不同的 js 函数而已
            if (window.createObjectURL != undefined) { // basic
                url = window.createObjectURL(file);
            } else if (window.URL != undefined) { // mozilla(firefox)
                url = window.URL.createObjectURL(file);
            } else if (window.webkitURL != undefined) { // webkit or chrome
                url = window.webkitURL.createObjectURL(file);
            }
            return url;
        }
    View Code

    使用方法:

    //html:
    
      <img src="{{person.HeadImgUrl}}"  style=" 100%;height: 100%;">
    
    //js:
     
    var file = document.getElementById("up").files[0];
     $scope.person.HeadImgUrl = API.getFileLocationUrl(file);
    View Code

    2,ajax上传文件:

     1 /**
     2      * 上传文件
     3      * @param file input[type=file]选择的文件
     4      * @param fileName 文件名称
     5      * @param postUrl  请求的后台url地址
     6      * @param token  验证的token
     7      * @param callBack 回调(接收上传结果)
     8      */
     9      function uploadFile (file, fileName, postUrl, token, successCallBack, errorCallBack) {
    10         var formData = new FormData();
    11         formData.append('uploadFile', file);
    12         formData.append('PicName', fileName);
    13 
    14         $.ajax({
    15             url: postUrl,
    16             data: formData,
    17             dataType: "json",
    18             type: "POST",
    19             beforeSend: function (request) {
    20                 request.setRequestHeader("Authorization", token);
    21             },
    22             //async: true,
    23             cache: false,
    24             contentType: false,
    25             processData: false,
    26             success: function (data) {
    27                 API.log(data);
    28                 successCallBack(data);
    29             },
    30             error: function (data) {
    31                 errorCallBack(data);
    32                 console.log(data);
    33             }
    34         });
    35     }
    View Code

    3,去空格处理,包括文字中间的空格以及首尾的空格

    /**
         * string 去空格操作
         * @param str 要去空格的字符串
         * @returns {string} 去完空格以后的字符串
         */
         function safeFilter (str) {
            return str.replace(/[ ]/g, "");
        },
    
        /**
        * 对一个对象中每个值进行安全检测, 去空格操作
        * @param str 要去空格的对象
        * @returns {string} 去完空格以后的对象
        */
        function everyProp (dataObj) {
            if (typeof dataObj == "string") {
                return this.safeFilter(dataObj);
            }
            for (prop in dataObj) {
                if (typeof dataObj[prop] == "object" && Array.isArray(dataObj[prop])) {
                    var list = dataObj[prop];
                    for (var i = 0; i < list.length; i++) {
                        list[i] = everyProp(list[i]);
                    }
                } else if (typeof dataObj[prop] == "object" && (dataObj[prop]) instanceof Object) {
                    dataObj[prop] = everyProp(dataObj[prop]);
                } else if (typeof dataObj[prop] == "string") {
                    if (prop != "FormMeta") {
                        dataObj[prop] = safeFilter(dataObj[prop]);
                    }
                }
            }
            return dataObj;
        }
    View Code

     4,js操作cookie

     //写入Cookie
        //name cookie名字
        //value cookie的值
        //expires 绝对过期时间,距现在的毫秒数 如30天:new date()+30*24*60*60*1000 
        setCookie: function (name, value, expires, path, domin, secure) {
            var cookie = name + "=" + encodeURIComponent(value);
            if (expires) {
                cookie += ";expires=" + expires.toGMTString();
            }
            if (path) {
                cookie += ";path=" + path;
            }
            if (domin) {
                cookie += ";domin=" + domin;
            }
            if (secure) {
                cookie += ";secure=" + secure;
            }
    
            document.cookie = cookie;
    
        },
    
        //获取指定名称的cookie值
        getCookie: function (name) {
            var sRe = "(?:;)?" + name + "=([^;]*);?";
            var oRe = new RegExp(sRe);
            if (oRe.test(document.cookie)) {
                return decodeURIComponent(RegExp["$1"]);
            } else {
                return null;
            }
    
        },
    View Code

    5,动态加载和移除css 、js文件

        /**
        * 动态加载CSS
        * @param {string} url 样式地址
        */
        dynamicLoadCss: function (url) {
            var head = document.getElementsByTagName('head')[0];
            var link = document.createElement('link');
            link.type = 'text/css';
            link.rel = 'stylesheet';
            link.href = url;
            head.appendChild(link);
        },
    
        /**
         * 动态加载JS
         * @param {string} url 脚本地址
         * @param {function} callback  回调函数
         */
        dynamicLoadJs: function (url, callback) {
            var head = document.getElementsByTagName('head')[0];
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.src = url;
            if (typeof (callback) == 'function') {
                script.onload = script.onreadystatechange = function () {
                    if (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") {
                        callback();
                        script.onload = script.onreadystatechange = null;
                    }
                };
            }
            head.appendChild(script);
        },
    
        /**
        * 动态移除CSS文件
        * @param {string} filename css文件名称
        */
        dynamicRemoveCssfile: function (filename) {
            var targetAttr = "href";
            var els = document.getElementsByTagName("link");
            for (var i = els.length; i >= 0; i--) {
                if (els[i] && els[i].getAttribute("href") != null && els[i].getAttribute("href").indexOf(filename) != -1)
                    els[i].parentNode.removeChild(els[i]);
            }
        },
    View Code

    6,格式化日期为固定格式“yyyy-mm-dd”,或 获取当日日期

        /**
        * 获取今日日期,或格式化日期为固定格式“yyyy-MM-dd”,
        * @param {Date} date  指定的要格式化的日期,缺省时获取当前日期
        * @returns {string}返回yyyy-mm-dd格式字符串
        */
        formatDateOrToday: function (date) {
            var dd = date || new Date();
            var y = dd.getFullYear();
            var m = dd.getMonth() + 1;
            var d = dd.getDate();
            m = m < 10 ? "0" + m : m;
            d = d < 10 ? "0" + d : d;
            var day = y + "-" + m + "-" + d;
            return day;
    
        }
    View Code

    7,获取今天,昨天。明天 的日期

        /**
         * 得到今天、昨天、明天日期
         * @param {int} dates  0代表今日,-1代表昨日,1代表明日,
         * @returns {string}返回yyyy-mm-dd格式字符串
         */
        getDate: function (dates) {
            var dd = new Date();
            var n = dates || 0;
            dd.setDate(dd.getDate() + n);
    
            return this.formatDateOrToday(dd);
        },
    View Code

    8,获取本周,上周,下周的起始和结束时间

        /**
         * 获取本周,上周,下周的起始和结束时间
         * @param {string} type "s"代表开始,"e"代表结束
         * @param {int} dates  不传或0代表本周,-1代表上周,1代表下周
         *  @returns {string}返回yyyy-mm-dd格式字符串
         */
        getDateOfWeek: function (type, dates) {
            var now = new Date();
            var nowTime = now.getTime();
            var day = now.getDay();
            var longTime = 24 * 60 * 60 * 1000;
            var n = longTime * 7 * (dates || 0);
            if (type == "s") {
                var dd = nowTime - (day - 1) * longTime + n;
            };
            if (type == "e") {
                var dd = nowTime + (7 - day) * longTime + n;
            };
            dd = new Date(dd);
            return this.formatDateOrToday(dd);
        },
    View Code

    9,获取本月,上月,下月的起始和结束时间

        /**
     * 获取本月,上月,下月的起始和结束时间
     * @param {string} type "s"代表开始,"e"代表结束
     * @param {int} dates  不传或0代表本月,-1代表上月,1代表下月
     *  @returns {string}返回yyyy-mm-dd格式字符串
     */
        getDateOfMonth: function (type, months) {
            var d = new Date();
            var year = d.getFullYear();
            var month = d.getMonth() + 1;
            if (!!months && Math.abs(months) > 12) {
                months = months % 12;
            };
            if (!!months) {
                if (month + months > 12) {
                    year++;
                    month = (month + months) % 12;
                } else if (month + months < 1) {
                    year--;
                    month = 12 + month + months;
                } else {
                    month = month + months;
                };
            };
            month = month < 10 ? "0" + month : month;
            var date = d.getDate();
            var firstday = year + "-" + month + "-" + "01";
            var lastday = "";
            if (month == "01" || month == "03" || month == "05" || month == "07" || month == "08" || month == "10" || month == "12") {
                lastday = year + "-" + month + "-" + 31;
            } else if (month == "02") {
                if ((year % 4 == 0 && year % 100 != 0) || (year % 100 == 0 && year % 400 == 0)) {
                    lastday = year + "-" + month + "-" + 29;
                } else {
                    lastday = year + "-" + month + "-" + 28;
                };
            } else {
                lastday = year + "-" + month + "-" + 30;
            };
            var day = "";
            if (type == "s") {
                day = firstday;
            } else {
                day = lastday;
            };
            return day;
        },
    View Code

    10,根据日期获取日期所在周(周一和周日)

        /**
        * 根据日期获取日期所在周(周一和周日)
        * @param {int} y  年份
        * @param {int} m  月
        * @param {int} d  日
        * @returns {obj}包含beginDate和endDate的对象
        */
        getWeekByDay: function (y, m, d) {
            var date = new Date(y, m, d);
            var year = date.getFullYear();
            var month = date.getMonth();
            var day = date.getDay() || 7;
            var date = date.getDate();
    
            var begin = new Date(year, month, date - day + 1);
            var end = new Date(year, month, date - day + 7);
            return {
                beginDate: this.formatDateOrToday(begin),
                endDate: this.formatDateOrToday(end)
            }
        },
    View Code

    11, 获取本年的起始和结束时间

        /**
        * 获取本年的起始和结束时间
        * @param {string} type "s"代表开始,"e"代表结束
        *  @returns {string}返回yyyy-mm-dd格式字符串
        */
        getDateOfYear: function (type) {
            var now = new Date();
            var year = now.getFullYear();
            if (type == "s") {
                var dd = new Date(year, 0, 1);
            }
            if (type == "e") {
                var dd = new Date(year, 11, 31);
            }
            return this.formatDateOrToday(dd);
        },
    View Code

    12,判断开始日期是否大于结束日期

        /**
         * 判断开始日期是否大于结束日期
         * @param {any} startTime string "2013-01-12"
         * @param {any} endTime string "2012-01-12"
         * @returns 
         *      false表示存在开始日期不能大于结束日期;
         *      true表示不存在
         */
        endDateMaxStartDate: function (startDate, endDate) {
            if (startDate.length > 0 && endDate.length > 0) {
                var startTmp = startDate.split("-");
                var endTmp = endDate.split("-");
                var sd = new Date(startTmp[0], startTmp[1], startTmp[2]);
                var ed = new Date(endTmp[0], endTmp[1], endTmp[2]);
                if (sd.getTime() > ed.getTime()) {
                    return false;
                }
            }
            return true;
        },
    View Code

    13,判断开始日期时间是否大于结束日期时间

        /**
        * 判断开始日期时间是否大于结束日期时间
        * 
        * @param {any} startTime string "2013-01-12 20:12:12"
        * @param {any} endTime string "2013-01-12 18:20:00"
        * @returns 
        *       false表示存在开始日期大于结束日期的情况;
        *       true表示不存在。
        * 知识点:      
        *       Date.parse(endTime) 得到日期的long时间戳
        *       new Date(Date.parse(endTime)); 转换成:Sat Jan 12 2013 18:20:00 GMT+0800 (中国标准时间)
        */
        endTimeMaxStartTime: function (startTime, endTime) {
            startTime = startTime.replace("-", "/");
            endTime = endTime.replace("-", "/");
            var endTime1 = new Date(Date.parse(endTime));
            var startTime1 = new Date(Date.parse(startTime));
            if (startTime1 > endTime1) {
                return false;
            }
            return true;
        }
    View Code
  • 相关阅读:
    Oracle 备份脚本
    Centos 安装DBI和ORACLE DBD
    人生到此初相见——北漂18年(10)
    备份上个月的日志
    mysql 授权
    竹杖芒鞋轻胜马,一蓑烟雨任平生——写在38岁生日
    haproxy 跨域访问:
    redis 配置说明
    vsftpd 500 OOPS: bad bool value in config file for: anon_world_readable_only
    vsftpd 配置虚拟用户
  • 原文地址:https://www.cnblogs.com/nanamiao/p/9493193.html
Copyright © 2020-2023  润新知