JavaScript Validation API

روش‌ها و ویژگی‌های DOM برای بررسی محدودیت‌ها

روش

روش وصف
checkValidity() اگر input عناصر شامل داده‌های معتبر باشد، درخواست true را برمی‌گرداند.
setCustomValidity() ویژگی validationMessage input عناصر را تنظیم می‌کند.

خصوصیت

خصوصیت وصف
validity ویژگی‌های بولن مربوط به اعتبار input عناصر را شامل می‌شود.
validationMessage پیام‌هایی را شامل می‌شود که در صورت نادرستی اعتبار، مرورگر نمایش می‌دهد.
willValidate نشان‌دهنده این است که آیا باید input عناصر را بررسی کنیم.

مثال - روش 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>

آپ خود سجاوٹ کریں

معتبریت خاصیت

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 رکھیجئے۔

مثال

rangeOverflow کا خاصیت

اگر input کا شمارا اور 100 سے زیادہ ہے (input کا max 属性),ثابت کریں:

<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>

آپ خود سجاوٹ کریں

rangeUnderflow کا خاصیت

اگر input کا شمارا اور 100 سے زیادہ ہے (input کا max 属性),ثابت کریں:

<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>

آپ خود سجاوٹ کریں