<html>
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8">
<title>
演示代码
</title>
<style>
input[type=text]{
border:1px solid red
width:300px
height:30px
}
span{
border-radius:90px
background-color:green
width:30px
height:30px
}
</style>
<script>
var s = ""
var kp = function(txt){
var ino = txt.nextElementSibling
if(!/^([1-9]\d?|0|100)$/.test(txt.value)){
txt.style.borderColor = "red"
ino.style.backgroundColor = "red"
ino.innerHTML = "×"
s = ""
}else{
txt.style.borderColor = "green"
ino.style.backgroundColor = "green"
ino.innerHTML = "√"
//不及格<60 及格 >60
s = txt.value * 1
}
}
function judge(){
if(s == "") return
if(s < 60){
alert("不及格")
}else{
alert("及格")
}
}
</script>
</head>
<body>
<input type="text" onkeyup="kp(this)" /> <span></span>
<br / >
<button onclick="judge()">
submit
</button>
</body>
</html>
用javascript进行判断，例如jQuery得validator插件等可以做到。不过html端的验证不靠谱，后台还是要验证的。因为js这东西运行在浏览器端，很容易就跳过js的检查了。欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）