<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>检测单词</title>
<link rel="stylesheet" href="https://www.bootcss.com/p/buttons/css/buttons.css">
<style>
input{
-webkit-appearance: none;
-moz-appearance: none;
appearance:none ;
outline: 0;
padding:0 8px;
}
input:focus{
box-shadow:0 0 5px 2px rgba(0,0,0,0.3);
}
.register{
width: 400px;
margin: 150px auto;
}
</style>
<script>
window.onload=function(){
document.getElementsByTagName("button")[0].onclick=function(){
var array=[];
// var matching=" ";
var bool=0;
var i=0;
var oInput=document.getElementsByTagName("input")[0].value;
if(oInput==""||oInput.slice(0,1)==" "|| /[0-9]/.test(oInput) || /[\u4e00-\u9fa5]/.test(oInput)){
alert("请正确输入英语单词");
return false
}
while(true){
bool=(oInput.indexOf(" ",bool))+1;
if(bool==0){
if(/\s/.test(oInput.charAt(oInput.length-1))){
alert(array.length+"个单词");
return false
}else{
alert(array.length+1+"个单词");
return false
}
}
array[i]=bool;
i++;
}
}
}
</script>
</head>
<body>
<div class="register">
<input type="text" value="">
<button class="button button-raised button-primary button-pill">统计</button>
</div>
</body>
</html>
测试单词数量文本框输入
最新推荐文章于 2021-07-08 08:53:59 发布