前端知识

1、节流(多次点击处理方法)

// 对应按钮所对应的上次时间
let btnIdsTimes = {};
/*
    func 要执行的点击方法
    delay 多少秒内只执行一次
	btnId 当前点击按钮的id值（自定义形参，需保证页面只有一个）
*/
function timeDelay(func,delay,btnId,params){
    // 如果没有则默认为1秒
    if(!delay){
       delay = 1000;
    }
	if(!btnIdsTimes[btnId]){
       btnIdsTimes[btnId] = 0;
    }
	
    return function(){
       let that = this;
       // 按钮现在点击时的时间戳
       let nowTime = new Date().getTime()

       // 距离对应按钮上次点击按钮的时间
       var overTime = delay - (nowTime - btnIdsTimes[btnId])
       // 如果时间差大于所规定的时间，则执行点击方法
       if(overTime <= 0){
           // 执行点击方法
           func(params);
           // 更新对应按钮上次点击的时间
           btnIdsTimes[btnId] = nowTime;
       }
    }
}

调用节流方法

节流1

2、form表单验证提示tip

1、定义一个方法(方法接收一个时间，设置tip停留的时间)

function isNeedTip(delayTime) {
    try {
        var formItems = [];
        $("input").each(function (index, inp) {
            if(inp.attributes.errMsg){
                formItems[inp.attributes.sort.value] = inp;
            }
        })

        $("select").each(function (index, sel) {
            if(sel.attributes.errMsg){
                formItems[sel.attributes.sort.value] = sel;
            }
        })

        formItems.forEach(function (item, i) {
            if(!item.value){
                if(!$(`#tip${item.attributes.sort.value}`)[0]){
                    $("body").append(`
                        
${item.attributes.errMsg.value}
                    `)
                }
                $(`#tip${item.attributes.sort.value}`).animate({top: "10px",opacity: 1}, 500);
                item.style.borderColor = "#f56c6c"

                setTimeout(function(){
                    $(`#tip${item.attributes.sort.value}`).animate({top: "-100px",opacity: 0}, 500);
                },delayTime)
                throw Error();
            }else{
                item.style.borderColor = ""
            }
        })
    } catch (e) {

    }

}

2、在css里面写入

.tip{
	opacity: 0;
	width: 200px;
	padding: 10px;
	background-color: #fef0f0;
	border-color: #fde2e2;
	border-radius: 4px;
	color:#f56c6c;
	position: absolute;
	top: -100px;
	left: calc(50% - 100px);
	text-align: center;
}

3、调用方法

isNeedTip(3000)

4、递归将阿拉伯数字转中文

    // 取出数字的每一位
	xa_getBigNum(num) {
		num = num + "";
		var length = num.length;
		var bigNum = "";

		// 单独判断10-20的特殊情况
		if(num<20&&num>10){
			if(num[1] != 0){
				bigNum = "十" + this.toBeBig(num[1]*1);
			}else{
				bigNum = "十";
			}
			return bigNum
		}
		
		// 判断数字末尾是否是0，是的话就不进入逻辑
		if (num.slice(num.length - 1) == 0) {
			lastPlace = 2;
		} else {
			lastPlace = 1;
		}

		for (var i = length; i >= lastPlace; i--) {
			// 取出当前数字的所在位数
			var numSplace = i;
			
			// 取出每一位数字
			var numTobeBig = Math.floor(num / (Math.pow(10, i - 1)));
			
			// 判断是否相邻两位数都为0，是的话就取第一个0
			if (bigNum[bigNum.length - 1] == "零" && bigNum[bigNum.length - 1] == this.toBeBig(numTobeBig)) {
				bigNum = bigNum;
			} else {
				bigNum = bigNum + this.toBeBig(numTobeBig) + this.numPlace(numSplace * 1, numTobeBig);
			}
			
			num = num.slice(1)
		}


		// 判断最终结果的最后一位是否为零，是的话就去掉
		if (bigNum[bigNum.length - 1] == "零") {
			bigNum = bigNum.slice(0,bigNum.length - 1);
		}

		return bigNum
	},


	// 判断第几位
	numPlace(length, num) {
	
		// 判断当前位是否为0
		if (num == 0) {
			return ""
		}
		switch (length) {
			case 1:
				return ""
				break;
			case 2:
				return "十"
				break;
			case 3:
				return "百"
				break;
			case 4:
				return "千"
				break;
			case 5:
				return "万"
				break;
			case 6:
				return "十万"
				break;

			default:
				break;
		}
	},
	
	// 数字转大写
	toBeBig(num) {
		switch (num) {
			case 0:
				return "零"
				break;
			case 1:
				return "一"
				break;
			case 2:
				return "二"
				break;
			case 3:
				return "三"
				break;
			case 4:
				return "四"
				break;
			case 5:
				return "五"
				break;
			case 6:
				return "六"
				break;
			case 7:
				return "七"
				break;
			case 8:
				return "八"
				break;
			case 9:
				return "九"
				break;
			default:
				break;
		}
	},