jQuery 验证 - 如果选择一个选项，则不需要下一个选项？

Question

我是一个十足的菜鸟，对一切都是新手，基本上按照教程来理解，我正在使用 jQuery 表单插件

我正在尝试制作一个选择“联系类型”的表单，如果选择“电话”选项，则需要“联系时间”，但如果选择“电子邮件”，则需要不需要“联系时间”。

*表单 html。*

<form id="askquestion" action="questionprocess.php" method="post">

                <td><label for="response type">Method of contact:</label></td>
                <td><select name="response_type"> 
                    <option value="" selected="selected">-- Please select --</option>

                    <option value="Phone">Phone</option>
                    <option value="Email">Email</option>
                    </select></td>
                    </tr>

                    <td><label for="response time">Best time to contact:</label></td>
                <td><select name="contact_time"> 
                    <option value="" selected="selected">-- Please select --</option>
                    <option value="morning_noon">Morning to Noon</option>
                    <option value="noon_afternoon">Noon to afternoon</option>
                    <option value="evenings">Evenings</option>
                    </select></td>
                    </tr>


        </form>

jQuery 规则:

$(function() {
    // Validate the contact form
  $('#askquestion').validate({
    // Specify what the errors should look like
    // when they are dynamically added to the form
    errorElement: "label",
    wrapper: "td",
    errorPlacement: function(error, element) {
        error.insertBefore( element.parent().parent() );
        error.wrap("<tr class='error'></tr>");
        $("<td></td>").insertBefore(error);
    },

    // Add requirements to each of the fields
    rules: {

        response_type: {
            required:true,
        },


        contact_time: {
            required:true,
        },

更新。这就是验证表单的结束方式。

// Use Ajax to send everything to form processing file
    submitHandler: function(form) {
        $("#send").attr("value", "Sending...");
        $(form).ajaxSubmit({
            success: function(responseText, statusText, xhr, $form) {
                $(form).slideUp("fast");
                $("#response").html(responseText).hide().slideDown("fast");
            }
        });
        return false;
    }
  });
});

Answer 1

rules: {
    response_type: {
        required: true,
        contact_time: {
            depends: function () {
                return $('#askquestion select[name="response_type"]').val() === 'Phone';
            }
        }
    },

它在文档中:http://docs.jquery.com/Plugins/Validation/validate#code