Farin ciki na 'oninvalid'

DOM ɗanar Event ɗanar

Tabbatar da amfani

Kuma, wanda zai yi amfani da farin ciki na 'oninvalid' yana kai tsaye wanda abin da zai yi amfani da <input> ya kasance da kuma farko yana cewa yankin ya kasance farko.

Wannan, kuma tana cewa a wasu wanda ya yi amfani da abin da ya fiwa 'required', kuma kafin wanda zai yi amfani da kuma yankin mai mahimmanci ya kasance kuma, yankin shi da kuma abin da zai yi amfani da ya kasance farko yana cewa yankin mai mahimmanci ya kasance da kuma farko yana kammala. (Dukiya mai mahimmanci ta nufin yankin mai mahimmanci ya zama dukiya kafin wanda zai kammala kuma zai ci gaba da rarraba shi).

实例

例子 1

如果输入字段无效，则提示一些文本：

<input type="text" oninvalid="alert('You must fill out the form!');" required>

Nuna ɗanar

页面下方有更多 TIY 实例。

语法

在 HTML 中：

<element oninvalid="myScript">

Nuna ɗanar

在 JavaScript 中：

object.oninvalid = function(){myScript};

Nuna ɗanar

在 JavaScript 中，使用 addEventListener() 方法：

object.addEventListener("invalid", myScript);

Nuna ɗanar

注释：Internet Explorer 8 或更早的版本不支持 addEventListener() 方法。

技术细节

冒泡： 不支持
可取消： 支持
事件类型： Event
支持的 HTML 标签： <input>
DOM 版本： Level 3 Events

浏览器支持

表中的数字注明了完全支持该事件的首个浏览器版本。

事件 Chrome IE Firefox Safari Opera
oninvalid 支持 10.0 支持 支持 支持

更多实例

例子 2

如果输入字段包含少于 6 个字符，则提示一些文本：

Name: <input type="text" id="myInput" name="fname" pattern=".{6,}" required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
  alert("Must contain 6 or more characters");
}
</script>

Nuna ɗanar

例子 3

如果输入字段包含小于 2 或大于 5 的数字，则提示一些文本：

Number: <input type="number" id="myInput" name="quantity" min="2" max="5" required>
<script>
document.getElementById("myInput").addEventListener("invalid", myFunction);
function myFunction() {
  alert("You must pick a number between 2 and 5. You chose: " + this.value);
}
</script>

Nuna ɗanar

Rarraba ɗanar

JavaScript ɗanar: JavaScript form

DOM ɗanar Event ɗanar