您的位置:首页 > Web前端 > JavaScript

JS小练习3(charAt)

2018-02-10 22:19 633 查看
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>输入合适的QQ号码</title>
</head>

<body>

请输入QQ号码:<input type="text" />
<input type="button" value="判断" />

<br />
1、有没有输入<br />
2、输入的是不是数字<br />
3、不能有0在前面<br />
4、不能是小数<br />
5、输入的数字必须在5位以上、12位以内<br />

<!-- 隐形中其实还少了些条件,
负数应该是不合法;-389978

Number("123e3")检测是一个数字;123e3=123000;

parseInt(oTxt)==parseFloat(oTxt) 利用这个判断输入的字符串转化后是不是小数,会发现
parseFloat("123e3")
123000
parseInt("123e3")
123
对于指数这种写法其实还不知道如何处理,如果是通过字符串中判断包含e这个字母那是不是有繁琐呢?
-->

<script>
window.onload = function(){
var oInp = document.getElementsByTagName('input');
//点击判断对数字进行判断
oInp[1].onclick = function(){
var oTxt = oInp[0].value;
test(oTxt);
}
//回车也进行判断
onkeydown = function KeyDown(){
if (event.keyCode == 13){
var oTxt = oInp[0].value;
test(oTxt);
}
}

function test(oTxt){
if(oTxt.length>0){
if(!isNaN(Number(oTxt))){
if(parseInt(oTxt)>0){
if(oTxt.charAt(0)!=0 && oTxt.indexOf("e")<0){
if(parseInt(oTxt)==parseFloat(oTxt)){
if(oTxt.length>=5&&oTxt.length<=12){
alert("恭喜你,输入有效")
}else{
alert("输入的数字必须在5位以上、12位以内")
}
}else{
alert("不能是小数")
}
}else{
alert("不能有0在前面或者是指数")
}
}else{
alert("输入数字要大于零");
}
}else{
alert("输入的是不是数字");
}
}else{
alert("请输入QQ号码")
}
}
}
</script>
</body>
</html>


反思:通过这种if~else进行判断的方式可读性很差,改成if~else if 方式可读性会稍微好一点,但是还是不够精简,后面看了解了正则表达式可以怎么优化下。。。

这里主要用到了string类型的几个方法,charAt(0)!=0 && oTxt.indexOf(“e”)

判断第一位是不是0和判断是否包含“e”这个子字符串

还用到了对数值转化和判断的一些操作。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息