为什么jQuery验证在这里不起作用

Question

我正在尝试使用jquery验证来验证表单，但它没有显示预期的错误消息。如何设置它以显示我的消息？

这是我正在使用的javascript：

$(function () {

$("#registerForm").validate({
    rules: {
        inputEmail: {
            required: true,
            email: true
        }
    },
    messages: {
        inputEmail: "Please enter a valid email address"
    }
});
});

请查看我的代码的jsfiddle链接：

JSFIDDLE code with html/bootstrap *已更新

在我的网站的实时版本中，它甚至没有显示出现在jsfiddle中的弹出消息。请帮我解决这个问题。

理想情况下，如果验证失败但我不想知道如何执行此操作，我会显示内联消息或摘要。我希望如果jquery验证工作，那么我将能够指定自定义函数来处理success和error事件。

如果有人能帮助我，我将不胜感激。感谢。

更新

Answer 1

请注意，即使我从jsFiddle中删除了jQuery和jQuery Validate，你仍然会遇到这个问题？

http://www.jsfiddle.net/xRRZb/4

由于HTML5，浏览器直接生成弹出式气泡和覆盖消息......与您的任何JavaScript或jQuery代码无关。

因为您已经在required中定义了email和.validate()规则，请从内联HTML中删除required和type="email"：

<input type="text" name="inputEmail" id="inputEmail" placeholder="E.g. youremail@website.com" />

DEMO：http://www.jsfiddle.net/xRRZb/6

---

修改

jQuery Validate 1.8已经很老了。考虑升级到版本1.11.1

事实上，这可能是你的整个问题。使用插件时Version 1.11.1 dynamically adds a novalidate="novalidate" attribute to the form tag to disable HTML5 validation。

不幸的是，version 1.8 does not have this feature。

或者，您可以手动添加novalidate属性以确保禁用HTML5验证。但是，如果您手动添加novalidate属性，则不会有后备。