功能
1.用js實現(xiàn)隨機(jī)輸入兩個數(shù),選取兩個數(shù)之間的10個數(shù)字,存入一個數(shù)組,按從小到大排序
2.防止輸入的不是數(shù)字,返回空,提示輸入數(shù)字
3.只有兩個數(shù)都輸入才能進(jìn)行隨機(jī)生成數(shù)存入數(shù)組
效果圖

不輸入.png

輸入.png
以下是主要代碼實現(xiàn):
// 監(jiān)聽input的輸入規(guī)范
inputObjs[i].oninput = function () {
var reg = /\D/g;
this.value = this.value.replace(reg, '');
};
inputObjs[i].onpaste = function () {
return false;
};
// 生成一個隨機(jī)數(shù)
function randomNum(n, m) {
var num = parseInt(Math.abs(Math.random() * (m - n) + n));
return num;
}
// 10個隨機(jī)數(shù)組成數(shù)組
for (var i = 0; i < 10; i++) {
arr.push(randomNum(n, m));
}
// 排序數(shù)組
function sequentialArray(arr) {
var temp = arr.sort(function (a, b) {
return a - b;
});
return temp;
}
以下是全部代碼:
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
input{
width: 100px;
}
</style>
</head>
<body>
<h3>請輸入兩個數(shù)字,得到兩數(shù)之間[n,m)的一個任意排序數(shù)組</h3>
<input type="text" placeholder="請輸入任意數(shù)字">
<input type="text" placeholder="請輸入任意數(shù)字">
<button id="btn">排序數(shù)組</button>
<p></p>
<p></p>
</body>
</html>
<script>
var inputObjs = document.getElementsByTagName('input');
var buttonObj = document.getElementById('btn');
var pObjs = document.getElementsByTagName('p');
for (var i = 0; i < inputObjs.length; i++) {
inputObjs[i].oninput = function () {
var reg = /\D/g;
this.value = this.value.replace(reg, '') // 除了0-9都替換空值
};
inputObjs[i].onpaste = function () {
return false;
}
}
buttonObj.onclick = function () {
if (inputObjs[0].value == '') {
console.log('請輸入第一個數(shù)');
} else if (inputObjs[1].value == '') {
console.log('請輸入第二個數(shù)');
} else {
var arr = [];
var n = Number(inputObjs[0].value);
var m = Number(inputObjs[1].value);
function randomNum(n, m) {
var num = parseInt(Math.abs(Math.random() * (m - n) + n));
return num;
}
for (var i = 0; i < 10; i++) {
arr.push(randomNum(n, m));
}
function sequentialArray(arr) {
var temp = arr.sort(function (a, b) {
return a - b;
});
return temp;
}
console.log('生成數(shù)組',arr);
pObjs[0].innerText = "生成數(shù)組:" + arr;
console.log('排序數(shù)組',sequentialArray(arr));
pObjs[1].innerText = "排序數(shù)組:" + sequentialArray(arr);
}
}
</script>
總結(jié)
代碼還需優(yōu)化