开发常用js(长期更新)

1、计算textarea剩余可输入
html:
<div class="comment-box">
<textarea name="comment" id="comment" cols="" rows="8" placeholder="在此输入..." maxlength="300"></textarea>
<div class="text-tip">还剩<span>300</span>字可输入</div>
</div>
css：
.comment-box{
position: relative;
}
.comment-box .text-tip{
position: absolute;
right: 1rem;
bottom: 1rem;
color: #999999;
font-size: 1rem;
}
js:
$('#comment').on('keyup',function () {
var textNum = $(this).val().length;
$('.text-tip span').text(300-textNum);
});

2、将body背景变成白色
window.onload = function(){
document.body.style.backgroundColor="#FFFFFF";
};
3、仿app的alert提示框
function messageBox(msg, type) {
//先形成一个弹窗，原生js
var body = document.getElementsByTagName('body')[0];
var div = document.createElement('div');
div.style.cssText = 'background:rgba(0,0,0,0.6);text-align:center;color:#ffffff;width:60%;font- size:13px;line-height:3;border-radius:5px;padding:3px 5px;opacity:0;z-index:111111';
div.innerHTML = msg;
body.appendChild(div);
var opacity = 0;
var opacityChange = setInterval(function () {
if (opacity > 1) {
setTimeout(function () {
var removeDiv = setInterval(function () {
opacity -= 0.01;
if(opacity < 0.01){
clearInterval(removeDiv);
body.removeChild(div)
}
div.style.opacity = opacity;
}, 1);
},500);
clearInterval(opacityChange);
}else{
div.style.opacity = opacity;
opacity += 0.01;
}
}, 1);
//将弹窗居中，此函数可使用jQuery ，不使用自己写也行
autoSize($(div));
//使弹出框在页面水平方向居中，在竖直方向偏下的函数
function autoSize(corObj) {
var wWidth = $(window).width();
var ihWidth = corObj.outerWidth(true);
corObj.css({"position":" fixed", "bottom": 150 + "px", "left": ((wWidth - ihWidth) / 2) + "px" });
}
}
4、使弹出的窗口居中
function autoSize(corObj) {
var wWidth = $(window).width(), wHeight = $(window).height();
var ihWidth = corObj.outerWidth(true), ihHeight = corObj.outerHeight(true);
var scrollTop = $(window).scrollTop();
corObj.css({"position":"absolute", "top": ((wHeight - ihHeight) / 2+scrollTop) + "px", "left": ((wWidth - ihWidth) / 2) + "px" });
}
5、手机号码
function getMessage(phone){
var message = "";
var myReg = /^(((13[0-9]{1})|(15[0-9]{1})||(17[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
if (phone == ''|| phone == undefined) {
message = "手机号码不能为空！";
} else if (phone.length != 11) {
message = "请输入正确的手机位数！";
} else if (!myReg.test(phone)) {
message = "请输入有效的手机号码！";
}
return message;
}
6、知道‘总和’和数量，产生随机并排序
Array.prototype.sum = function () {
var result = 0;
for (var i = 0; i < this.length; i++) {
result += this[i];
}
return result;
};
function getRandom(number, sum) {
avg = sum / number;
gtHalf = 0;
listArr = [];
for (i = 0; i < number - 1; i++) {
if (gtHalf > number / 2) {
avg = (sum - listArr.sum()) / (number - gtHalf)
chooseNum = parseInt((Math.random() + 0.5) * avg);
} else {
chooseNum = parseInt((Math.random() + 0.5) * avg);
gtHalf++
}
listArr.push(chooseNum)
}
//最后求出最少
listArr.push(sum - listArr.sum());
sortedArr = listArr.sort(function (a, b) {
return b > a;
});
console.log((listArr))
}