运用了css,js

代码如下:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>大批量生成数组数据</title>
<style>
body{background-color: #4c718a}
.BB{
width: 400px;
height: 300px;
position: absolute;
left:400px ;
top: 1px;
margin-left: 50px;
/*margin-top: -150px;*/
/**/
}
.EE{
width: 400px;
height: 300px;
position: absolute;
left:250px ;
top: 360px;
margin-left: 50px;
/*margin-top: -150px;*/
/**/
}
.FF{
width: 400px;
height: 300px;
position: absolute;
left:550px ;
top: 360px;
margin-left: 50px;
/*margin-top: -150px;*/
/**/
}
.GG{
width: 400px;
height: 300px;
position: absolute;
left:850px;
top: 310px;
margin-left: 50px;
/*margin-top: -150px;*/
/**/
}
</style>

<script type="text/javascript">
function newArray(){
var patrn = /^[0-9]*$/;
var qz = "COO";//前缀
var numStart=document.getElementById("textst").value; //数量起
var numEnd=document.getElementById("textEnd").value; //数量止
var numberCopies=document.getElementById("numberCopies").value; //份数
if(!patrn.test(numStart) && !patrn.test(numEnd) && !patrn.test(numberCopies)){
alert("请输入合法的数字!!!");
return;
}
var dataNum = numEnd - numStart + 1;
if(dataNum<0){
alert("请输入准确的起止数字!!!");
}
var myArr=new Array();
var z=0;
for(i = 0; i < dataNum ; i++) {
for(j = 0; j < numberCopies ; j++) {
myArr[z] = qz + numStart;
z++ ;
}
numStart++;
}
document.getElementById("textAll").value=myArr;
document.getElementById("textBll").value=myArr;
}

//删除数据
function deleted() {
var data = document.getElementById("textAll").value;
var data = document.getElementById("textBll").value;
var arr = document.getElementById("arr").value;
console.log(arr);
var index = data.indexOf(arr);
console.log(index);
if (index != -1) {
var newData = data.replace(arr, "");
document.getElementById("textAll").value = newData;
document.getElementById("textBll").value = newData;
}
}
</script>

</head>
<body>
<form action="acions">
<div class="cc">
<div class="aa" >
<h5>根据条码规则生成原始数据( 0 )</h5>
<textarea style="width:300px;height:150px; overflow:scroll; border:1px solid;" id="textAll" >
</textarea></br>
<input type="text" id="textst" placeholder="数量起"/></br>
<input type="text" id="textEnd" placeholder="数量止"/></br>
<input type="text" id="numberCopies" placeholder="份数" /></br>
<input type="button" onclick="newArray()" value="数据生成" /></br>
<input type="text" id="arr" placeholder="输入已有的数据" /></br>
<input type="button" onclick="deleted()" value="删除数据" /></br>
</div>

<div class="BB">
<h5>待检测条码( 0 )</h5>
<textarea style="width:300px; height:150px; overflow:scroll; border:1px solid;" id="textBll" ></textarea></br>
<input type="text" id="text" placeholder="输入测试数据"/></br>
<input type="button" onclick="newArray()" value="测试数据" /></br>
</div>
<div class="DD">
<h6>不存在条码( 0 )</h6>
<textarea style="width:200px; height:200px; overflow:scroll; border:1px solid;" id="textCll" ></textarea></br>
</div>
<div class="EE">
<h6>重复条码( 0 )</h6>
<textarea style="width:200px; height:200px; overflow:scroll; border:1px solid;" id="textDll" ></textarea></br>
</div>
<div class="FF">
<h6>错误条码( 0 )</h6>
<textarea style="width:200px; height:200px; overflow:scroll; border:1px solid;" id="textEll" ></textarea></br>
</div>
<div class="GG">
<h3 style="size: auto">条码检测报告</h3>
<h6>----------------------------------</h6>
<h5>检测时间:2018-06-26</h5>
<h5>检测人:&emsp;&emsp;***</h5>
<h5>不存在条码:( 0 )</h5>
<h5>重复条码:( 0 )</h5>
<h5>错误条码:( 0 )</h5>
<input type="button" onclick="newArray()" value="提交" /></br>
</div>
</div>
</form>
</body>
</html>
posted @ 2018-06-26 16:42  曾祥财  阅读(118)  评论(0编辑  收藏  举报