记一些开发中遇到得问题...

onclick事件传递对象参数
onclick="todo("+JSON.stringify(data).replace(/"/g, '"')+")"
demo:
查看//传递单个参数 单引号拼接
"查看"//双引号拼接 传递对象参数--需要用\(反斜杠)转义
ajax post方法参数问题
let obj={};
obj.gameName='xxx';
obj.gameId='xxx';
$.ajax({
            type: "POST",
            url: url+ "?t=" + new Date().getTime(),
            data: JSON.stringify(obj),
            contentType: "application/json; charset=UTF-8",
            dataType: "json",
            success: function (res) {
               console.log(res)
        });
//使用contentType: “application/json”则data只能是json字符串
switch(data){}
switch(data){
  case '1':
      console.log(11);
      break;
case 2:
    console.log(22);
    break;
}
//switch对参数类型敏感 可以先打印看看data到底是什么类型的参数 console.log(typeof data);
//如果参数data=1是字符串可以打印出11,但是如果1是number那么久不会去执行case1下面得了
WdatePicker.js使用
//代码如下:


//显示年月日时分秒:onFocus="WdatePicker({ dateFmt: 'yyyy-MM-dd HH:mm:ss'})"
//结束时间为开始时间七天以内:startTime--maxDate:'#F{$dp.$D(\'endTime\',{d:-7})}'
// endTime--minDate:'#F{$dp.$D(\'startTime\')}',maxDate:'#F{$dp.$D(\'startTime\',{d:7})}'
使用toFixed()函数时,出现“toFixed() is not a function”的解决办法
typeof item.price//string
//toFixed只能针对数字类型才能使用,所以对于字符类型的要用parseFloat或者parseInt函数先转一下再调用
parseInt(item.price).toFixed(2)//item.price=34.000 -- 34.00
js获取当前时间的前一天/后一天
var now=new Date();
var preDate = new Date(now.getTime() - 24*60*60*1000); //前一天
var nextDate = new Date(now.getTime() + 24*60*60*1000); //后一天
try catch
//背景--url跳转中文参数编码,由于未登录先去登录站点登录,进行了二次编码,导致获取url中文参数乱码问题
try {
    tryCode - 尝试执行代码块
}
catch(err) {
    catchCode - 捕获错误的代码块
} 
finally {
    finallyCode - 无论 try / catch 结果如何都会执行的代码块
}
//demo
// 获取URL对应参数值
function getUrlParam(name){
    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
    var r = window.location.search.substr(1).match(reg);  //匹配目标参数
    if (r!=null){
        try {
            return decodeURI(r[2]); //报错执行catch下得代码
        }catch(e){
            return unescape(r[2])
        }
    }else{
        return null; //返回参数值
    } 
}
限制input输入数字且小数点后最多n位
function num(value,length) {
    //length代表可以输入得小数位数
    value = value.replace(/[^\d.]/g, "");  //清除“数字”和“.”以外的字符
    value = value.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
    value = value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
    var str='^(\\-)*(\\d+)\\.([0-9]{1,'+length+'}).*$';//给正则表达式代入动态参数 ,注意--反斜杠需要转义
    var reg=new RegExp(str);
    value = value.replace(reg,'$1$2.$3');//只能输入两个小数-- /^(\-)*(\d+)\.([0-9]{1,2}).*$/
    if (value.indexOf(".") < 0 && value != "") {//以上已经过滤,此处控制的是如果没有小数点,首位不能为类似于 01、02的金额
       value = parseFloat(value);
    }
    return value
}
//使用:如果小数后面五位则num(this.value,5)

限制input输入数字且小数点后最多n位(第一位不能是小数点)
function num(obj) {
    obj.value = obj.value.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
    obj.value = obj.value.replace(/^\./g, ""); //验证第一个字符是数字
    obj.value = obj.value.replace(/\.{2,}/g, "."); //只保留第一个, 清除多余的
    obj.value = obj.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
    obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d).*$/, '$1$2.$3'); //只能输入一个小数
}
//两位小数
obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //添加 \d 即为小数位数
//使用

测试环境线上环境接口域名不同
#获取协议 域名端口 拼接请求url
`${location.protocol}//${location.host}`
`${location.protocol}//${location.host}/api/getInfo`
js返回上一页并刷新页面
//返回
self.location=document.referrer
当前时间是否符合某时间区间判断(跨天)
window.onload = function () {
            let timeList = ['09:00', "01:00"];
            checkTime(...timeList)
        }
        function checkTime(startTime, endTime) {
            //console.log(startTime, endTime);
            //let now = new Date('2018-09-19 0:00').getTime();
            let now = new Date().getTime();
            let start = new Date().setHours(startTime.split(':')[0], startTime.split(':')[1], 0);
            let end = new Date().setHours(endTime.split(':')[0], endTime.split(':')[1], 0);
            if (end < start) {//end小于start表示是跨天区间
                end += 24 * 60 * 60 * 1000//end加上一天
            }
            if (start < now && now < end) {
                console.log(`在符合时间段内`);
            } else {
                console.log(`不在符合的时间段内,时间段为${startTime}-${endTime}`);
            }
        }
input限制只能输入纯数字问题
1、onkeyup = "value=value.replace(/[^\d]/g,'')"
=> 使用 onkeyup 事件,有 bug ,那就是在中文输入法状态下,输入汉字之后直接回车,会直接输入字母
2、onchange = "value=value.replace(/[^\d]/g,'')"
=>使用 onchange 事件,在输入内容后,只有 input 丧失焦点时才会得到结果,并不能在输入时就做出响应
3、oninput = "value=value.replace(/[^\d]/g,'')"
=>使用 oninput 事件,完美的解决了以上两种问题,测试暂时还没有出现其它问题。
window.open在ajax请求完成新窗口被拦截的问题
//解决--先通过用户点击打开一个新的空白窗口,然后再对新打开的页面进行重定向。
        var newOpen=window.open();
        $.ajax({
            type: "GET",
            url: url,
            data: data,
            contentType: "application/json; charset=UTF-8",
            dataType: "json",
            success: function (resp) {
                if (resp.success) {
                    newOpen.location.href = baseServiceUrl + "shPayment?orderId=" + resp.orderId;
                } else {
                  console.log('请求失败')
                }
            }
        });
WebUploader上传图片删除以后再上传同一张图片 提示超过大小限制(限制:10M,图:9M)

WebUploader API

getFiles
getFiles() ⇒ Array
getFiles( status1, status2, status... ) ⇒ Array
返回指定状态的文件集合,不传参数将返回所有状态的文件。

这里的状态如下:

File.Status
文件状态值,具体包括以下几种类型:

-inited 初始状态
-queued 已经进入队列, 等待上传
-progress 上传中
-complete 上传完成。
-error 上传出错,可重试
-interrupt 上传中断,可续传。
-invalid 文件不合格,不能重试上传。会自动从队列中移除。
-cancelled 文件被移除。
就是说,只要我们的uploader对象没有重新创建,那它会保存所有选择的文件,

当然我们也有方法,clear一下, 我们看到有这样的方法:

removeFile
removeFile( file ) ⇒ undefined
removeFile( id ) ⇒ undefined
removeFile( file, true ) ⇒ undefined
removeFile( id, true ) ⇒ undefined
参数:

file {File, id}
File对象或这File对象的id

移除某一文件, 默认只会标记文件状态为已取消,如果第二个参数为 true 则会从 queue 中移除。

当我们调用了一下removeFile方法后,只是标记了一下这个文件的状态,我们用getFiles方法,其实还是可以看到,

这时我们可以再调用方法:

reset
reset() ⇒ undefined
重置uploader。目前只重置了队列。就可以清除勾选的上传文件了

在uploadSuccess事件中,调用removeFile方法,注意这个事件也是针对一个文件的
//成功事件,  针对一个文件
uploader.on('uploadSuccess', function (file, response) {
    
  uploader.removeFile(file);

});

在uploadFinished事件中,调用reset方法,就可清空getfiles了
// 所有文件上传成功后调用        
uploader.on('uploadFinished', function () {
    //清空队列
     uploader.reset();
});

//uploader pick自动生成的上传按钮位置不对(应包含在wrap内却在body中)
 uploader = WebUploader.create({
        auto: true,
        pick: {
            id: '#filePicker',
            label: '上传图片',
            multiple: false
        },
        paste: document.body,

        accept: {
            title: 'Images',
            extensions: 'gif,jpg,bmp,png,jpeg',
            mimeTypes: 'image/gif,image/jpg,image/bmp,image/png,image/jpeg'
        },

        // swf文件路径
        swf: './swf/uploader.swf',

        disableGlobalDnd: true,
        timeout: 0,
        chunked: false,
        chunkSize: 10 * 1024 * 1024,
        server: '/api/UploadFile',
        fileNumLimit: 1,
        fileSizeLimit: 10 * 1024 * 1024, // 10 M
        fileSingleSizeLimit: 10 * 1024 * 1024 // 10 M
    });
//uploader初始化以后调用
    uploader.refresh();
获取图片img的真实宽高大小
// 获取图片真实高度
function getImageSize(url,callback){
    var img = new Image();
    img.src = url;
    // 如果图片被缓存,则直接返回缓存数据
    if(img.complete){
        callback(img.width, img.height);
    }else{
        img.onload = function(){
            callback(img.width, img.height);
        }
    }
}
//调用:
$(function(){
    var imgSrc = $("#img").attr("src");
    getImageSize(imgSrc,function(w,h){
        console.log({width:w,height:h});
    });
});
w--图片的宽 h--图片的高
时间问题
//判断时间是否是当天
var str = 1404172800000;
if (new Date(str).toDateString() === new Date().toDateString()) {
    //今天
} else if (new Date(str) < new Date()){
    //之前
    console.log(new Date(str).toISOString().slice(0,10));//2014-07-01
}
//判断当前时间是否是一天内,超过一天不超过三十天,超过三十天
showTime(sendTime) {
        console.log(sendTime);    //"2019-01-08T10:49:29"
        let now = new Date().getTime(); //当前时间戳
        let orderTime = new Date(sendTime).getTime(); //订单最后会话时间
        let oneday = 24 * 60 * 60 * 1000,
            month = 30 * 24 * 60 * 60 * 1000;
        if ((now - orderTime) < oneday) {
            sendTime = sendTime.split('T')[1]
            //一天内
        }
        if ((now - orderTime) > oneday || (now - orderTime) < month) {
            //超过一天 不超过30天
            sendTime = `${Math.ceil((now-orderTime)/(24*60*60*1000))}天前`
        }
        if ((now - orderTime) > month) {
            //超过30天
            sendTime = sendTime.replace('T', ' ')
        }
        return sendTime
    }
字符串首尾保留中间星号
function parseStringToStar(str, len, fixLen) {
    //str-- 传入的字符串
    //len-- 首尾需保留的长度
    //fixLen --是否固定显示星号数量
    var starLen = fixLen ? new Array(fixLen + 1).join('*') : (str.length > 6 ? new Array(str.length - (2 * len - 1)).join(
        '*') : new Array(str.length -
        (len - 1)).join('*'))
    return str.length > 6 ? str.substr(0, len) + starLen + str.substr(-len) : str.substr(0, len) + starLen
}

//使用
## parseStringToStar('[email protected]',3,3)
## "278***com"

## parseStringToStar('[email protected]',3)
## "278**********com"

## parseStringToStar('123456',3)
## "123***"
js正则去除字符串中的中文英文数字
str.match(/[a-zA-Z0-9\u4e00-\u9fa5]+/g).join('');
str.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g,'')
js 过滤敏感词 ,可将带有标点符号的敏感词过滤掉
//简单版本
function transSensitive(content) {
    var Sensitive = wordList//敏感词数组
    var v = new RegExp(Sensitive.join('|'), "gi");//将数组转成正则
    var array = new Array();
    //将特殊符号的过滤并且保存
    content = content.replace(/[\ |\~|\`|\!|\@|\#|\$|\%|\^|\&|\*|\(|\)|\-|\_|\+|\=|\||\\|\[|\]|\{|\}|\;|\:|\"|\'|\,|\<|\.|\>|\/|\?]/g, function (s, i) {
        array.push({
            index: i,
            content: s
        });
        return s.replace(/./g, '');
    })
    //将敏感词进行筛选
    console.log(content, v);
    return content.replace(v, '**')
}

//适用
function filterWords(content) {
    //敏感词数组--wordList
    var v = new RegExp(wordList.join('|'), "gi");//将数组转成正则
    var array = new Array();
    //将特殊符号的过滤并且保存
    content = content.replace(/[\ |\~|\`|\!|\@|\#|\$|\%|\^|\&|\*|\(|\)|\-|\_|\+|\=|\||\\|\[|\]|\{|\}|\;|\:|\"|\'|\,|\<|\.|\>|\/|\?]/g, function (s, i) {
        array.push({
            index: i,
            content: s
        });
        return s.replace(/./g, '');
    })
    //将敏感词进行筛选
    console.log(content, v);
    var output = content.replace(v, function (sMatch) {
        //sMatch 匹配到的敏感词
        if (sMatch.length <= 1) {
            return sMatch.replace(/./g, '*');
        }
        else {
            return sMatch.replace(/./g, '*');
            /* return sMatch[0] + sMatch.replace(/./g, '*').substring(0, sMatch.length - 1);//将词的第一个字保留 */
        }
    })
    var array2 = output.split('');//将字符串转成char数组
    console.log(array, array2);
    //循环array 将array[i].content 通过array[i].index 插入指定位置 现将array[i].content  应该算是拼接
    for (var i = 0; i < array.length; i++) {
        array2.splice(array[i].index, 0, array[i].content);
    }
    console.log(array2);
    return array2.join('');
}
ajax contentType
1. application/x-www-form-urlencoded(默认类型)

如果不指定其他类型的话, 默认是x-www-form-urlencoded, 此类型要求参数传递样式为 key1=value1&key2=value2

2. application/json

更适合传递大数据的形式, 参数样式就是json格式, 例如{"key1":"value1","key2":[1,2,3]}等
获取最近一周七天(或指定天数)的日期
function getBeforeDate(number) {
    let num = number;
    let dateList = [], s;
    for (let i = 0; i < number; i++,num--) {
        const date = new Date();
        let year = date.getFullYear();
        let mon = date.getMonth() + 1;
        let day = date.getDate();
        if (day <= num) {
            if (mon > 1) {
                mon = mon - 1;
            } else {
                year = year - 1;
                mon = 12;
            }
        }
        date.setDate(date.getDate() - num);
        year = date.getFullYear();
        mon = (date.getMonth() + 1) < 10 ? `0${date.getMonth() + 1}` : date.getMonth() + 1;
        day = date.getDate() < 10 ? `0${date.getDate()}` : date.getDate();
        // s = year + '-' + (mon < 10 ? ('0' + mon) : mon) + '-' + (day < 10 ? ('0' + day) : day);
        s = `${mon}${day}`
        dateList.push(s)
        // num-=1
    }
    return dateList;
}

//使用
## getBeforeDate(7) //获取最近一周七天的日期
## 返回结果 Array: ["1016", "1017", "1018", "1019", "1020", "1021", "1022"]

你可能感兴趣的:(记一些开发中遇到得问题...)