无效事件侦听器未激活的html5验证

Question

我的html中有一个带有以下标记的表单

<form>
    <input type="text" name="fname" required>
    <input type="submit" value="Submit">
</form>

我还有两个脚本标签,一个用于jquery,另一个用于我的javascript,我称之为validate.js

<script src="jquery-2.1.4.min.js"></script>
<script src="validate.js"></script></body>

当我将以下代码放入我的validate.js文件并提交无效数据时.该页面按预期警告"无效".

$("form input").on("invalid", function() {
     alert("invalid");
});

当我在validate.js中使用此代码时,当我单击输入时,页面再次按预期运行,此时警告"单击".

$("body").on("click", "form input", function(){alert("click");});

但是,以下代码不起作用.提交无效数据时,无效事件处理程序不会触发,并且"无效"不会被警告.

$("body").on("invalid", "form input", function(){alert("invalid");});

我想这样做,因为在我的应用程序中,我从ajax请求向我的页面添加一个表单,因此我想将事件处理程序附加到正文而不是表单本身.有什么理由不行吗？

Answer 1

$("body").on("invalid", "form input", function(){alert("invalid");}); 这可能不起作用，因为这是一个实时事件，其中事件附加到正文，并且触发器对正文无效，但对表单输入无效。

$("body").on("click", "form input", function(){alert("invalid");}); 例如，如果我们将其更改为单击，则该事件会监听主体单击，然后将事件传播到表单输入。

尝试使用直接选择器。