jQuery 验证插件 - 如何在错误时更改 css

发布于 2024-09-29 01:34:37 字数 571 浏览 0 评论 0原文

我正在关注这里的演示

http://jquery.bassistance.de/validate/demo/marketo /

提交表单时，如果该字段为空，输入框和其他字段如何获得红色边框？我必须在我的插件减速中添加什么才能得到它？

更新

$("#profile_form").validate({
        rules: {
            nickname: "required",
            address: "required"
        },
        messages: {
            nickname: "(required)",
            address: "&nbsp;(required)"
        }
    });

我知道如何通过css获取边框，我需要知道验证插件如何更改css。

问候

原文

I am following the demo over here

http://jquery.bassistance.de/validate/demo/marketo/

On submitting the form, if the field is empty, how are the input boxes and other fields getting that red border around them? What is it I have to add in my plugin decleration to get that?

Update

$("#profile_form").validate({
        rules: {
            nickname: "required",
            address: "required"
        },
        messages: {
            nickname: "(required)",
            address: " (required)"
        }
    });

I know how to get the border via css, I need to know how is the validate plugin changing the css.

Regards

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

想念有你 2024-10-06 01:34:37

这就是我完成我正在寻找的东西的方法...

$("#profile_form").validate({
        rules: {
            nickname: "required",
            address: "required"
        },
        messages: {
            nickname: "(required)",
            address: " (required)"
        }, highlight: function(element) {
            $(element).addClass('error');
        }, unhighlight: function(element) {
            $(element).removeClass('error');
        }
    });

使用 jquery.validate 插件中的 highlight 和 unhighlight 选项可以解决问题。

This is how I accomplished what I was looking for...

$("#profile_form").validate({
        rules: {
            nickname: "required",
            address: "required"
        },
        messages: {
            nickname: "(required)",
            address: " (required)"
        }, highlight: function(element) {
            $(element).addClass('error');
        }, unhighlight: function(element) {
            $(element).removeClass('error');
        }
    });

Using the highlight and unhighlight options in the jquery.validate plugin does the trick.

回复收藏 0 原文

匿名。 2024-10-06 01:34:37

像这样的东西就可以做到...

CSS

input.error,
select.error,
textarea.error {
    border: 3px solid red;
}

在这种情况下，Firebug 是你的朋友。

Something like this will do it...

CSS

input.error,
select.error,
textarea.error {
    border: 3px solid red;
}

In this case, Firebug is your friend.

回复收藏 0 原文

小矜持 2024-10-06 01:34:37

您可以将 blur() 事件处理程序附加到输入框。在回调函数中，您将检查输入的内容，然后使用 css() 相应地更改 css。

例子：

<input type="text" id="myField" />

<script type="text/javascript">
    $("#myField).blur(function() {
        if ($(this).val() == "") {
            $(this).css("borderColor", "red");
        }
    });
</script>

You would attach a blur() event handler to the input box. In your callback function, you would check the contents of the input then change the css accordingly using css().

Example:

<input type="text" id="myField" />

<script type="text/javascript">
    $("#myField).blur(function() {
        if ($(this).val() == "") {
            $(this).css("borderColor", "red");
        }
    });
</script>

回复收藏 0 原文

~没有更多了~