jquery - 尝试使用 jQuery Validate 插件验证依赖于另一个选项的字段时出现错误

Question

我正在使用 jQuery Validate 作为表单。我需要添加一些功能，因此如果从选择/下拉菜单中选择特定选项，则需要附加字段。

下面是他们在 jQuery 网站上提供的示例，如果在复选框中选中了某个选项，则需要某个字段 (http://docs.jquery.com/Plugins/Validation/validate#options):

$(".selector").validate({
   rules: {
     contact: {
       required: true,
       email: {
         depends: function(element) {
           return $("#contactform_email:checked")
         }
       }
     }
   }
})

我让它工作，如果选择特定选项，它将显示附加字段。一旦选择菜单失去焦点，控制台中就会出现以下错误:

Uncaught TypeError: Cannot call method 'call' of undefined

我在 JSFiddle 上发布了一个示例。如果有人可以看一下，我将不胜感激。我需要尽快让它工作!

http://jsfiddle.net/2EfPZ/

Answer 1

发生错误是因为您需要将 depends 函数与特定的验证规则关联起来:

$form.validate({
    rules: {
        favoriteSport: {
            required: true
        },
        position: {
            required: {
                depends: function(element) {
                    return $('#favoriteSport').val() === '1';
                }
            }
        },
        player: {
            required: {
                depends: function(element) {
                    return $("#favoriteSport").val() === '1';
                }
            }
        }
    },
    messages: {
        favoriteSport: "You must select a favorite sport",
        position: "You must select a position because you selected football",
        player: "You must select a player because you selected football"
    }
});

工作示例:http://jsfiddle.net/2EfPZ/20/