js setCustomValidity方法

使用setCustomValidity方法改变自定义的提示信息

<p>输入数字并点击验证按钮:</p>
<input id="uu" type="number" max="700" min="200" required="required">
<button onclick="myfunction()">验证</button>
<p>如果输入的数字小于 200 或大于700，会提示错误信息。</p>

<p id="demo"></p>
<script>
	function myfunction(){
		var inpobj=document.getElementById("uu");
		inpobj.setCustomValidity("") //取消自定义提示的方式
		if (inpobj.checkValidity() == false){
			inpobj.setCustomValidity("输入错误，看清要求，重新输入")
			document.getElementById("demo").innerHTML=inpobj.validationMessage;
			
		}else{
			document.getElementById("demo").innerHTML="输入正确!";
		}
	}
</script>

<input id="id1" type="number" min="100">
<button onclick="myFunction()">验证</button>

<p>如果输入的数字小于100 , 会显示错误信息。</p>

<p id="demo"></p>

<script>
function myFunction() {
    var txt = "";
    if (document.getElementById("id1").validity.rangeUnderflow) {
        txt = "输入的值太小了";
    } else {
        txt = "输入正确";
    }
    document.getElementById("demo").innerHTML = txt;
}
</script>