JavaScript ਪ੍ਰਮਾਣੀਕਰਣ API

ਸੀਮਾ ਪ੍ਰਮਾਣਿਕਤਾ

属性 描述
checkValidity() 如果 input 元素包含有效数据,则返回 true。
setCustomValidity() 设置 input 元素的 validationMessage 属性。

如果输入区域包含无效数据,将显示一次次断消息:

checkValidity() 方法

<input id="id1" type="number" min="100" max="300" required>
<button onclick="myFunction()">OK</button>
<p id="demo"></p>
<script>
function myFunction() {
  const inpObj = document.getElementById("id1");
  if (!inpObj.checkValidity()) {
    document.getElementById("demo").innerHTML = inpObj.validationMessage;
  }
}
</script>

ਆਪਣੇ ਅਨੁਸਾਰ ਕੋਸ਼ਿਸ਼ ਕਰੋ

线接验证 DOM 属性

属性 描述
validity 包含与输入元素验证相关的布尔属性。
validationMessage 包含当验证为 false 时浏视器将添展的次断次断消息。
willValidate 指示是否将验证 input 元素。

验证属性

input 元素的验证属性包含很多与数据验证相关的属性。

属性 描述
customError 如果设置了自定义验证正确次断,设置为 true。
patternMismatch 如果元素的值与它的 pattern 属性不匹配,设置为 true。
rangeOverflow 如果元素的值大于它的 max 属性,设置为 true。
rangeUnderflow 如果元素的值小于它的 min 属性,设置为 true。
stepMismatch 如果元素的值对该 step 属性无效,设置为 true。
tooLong 如果元素的值超过它的 maxLength 属性,设置为 true。
typeMismatch 如果元素的值对该 type 属性无效,设置为 true。
valueMissing 如果元素(其有 required 属性)未有值,设置为 true。
valid 如果元素的值有效,设置为 true。

instance

如果输入区域中的数字大于 100 (输入元素的 max ਗੁਣ) ਤਾਂ ਸੁਨੇਹਾ ਦਿਖਾਇਆ ਜਾਵੇਗਾ:

rangeOverflow 主质

<input id="id1" type="number" max="100">
<button onclick="myFunction()">OK</button>
<p id="demo"></p>
<script>
function myFunction() {
  let text = "Value OK";
  if (document.getElementById("id1").validity.rangeOverflow) {
    text = "Value too large";
  }
}
</script>

ਆਪਣੇ ਅਨੁਸਾਰ ਕੋਸ਼ਿਸ਼ ਕਰੋ

ਜੇਕਰ ਇੰਪੁਟ ਫੀਲਡ ਵਿੱਚ ਦਿੱਤਾ ਗਿਆ ਨੰਬਰ 100 ਤੋਂ ਘੱਟ ਹੈ (input ਐਲੀਮੈਂਟ min ਗੁਣ) ਤਾਂ ਸੁਨੇਹਾ ਦਿਖਾਇਆ ਜਾਵੇਗਾ:

rangeUnderflow ਗੁਣ

<input id="id1" type="number" min="100">
<button onclick="myFunction()">OK</button>
<p id="demo"></p>
<script>
function myFunction() {
  let text = = "Value OK";
  if (document.getElementById("id1").validity.rangeUnderflow) {
    text = "Value too small";
  }
}
</script>

ਆਪਣੇ ਅਨੁਸਾਰ ਕੋਸ਼ਿਸ਼ ਕਰੋ