javascript - 根据复选框更改提交 onclick

Question

我有一个用作基本联系表单的表单。我添加了一个复选框，如果选中，则会添加一些字段。如何根据是否选中此框来更改提交按钮的 onclick 操作。这是我目前拥有的。

<form  class="homeContact"> 
        <label for="chkJob">
            Interested in a career? Check to apply
            <input type="checkbox" id="chkJob" />
        </label>
        <div id="dvApply" style="display: none">

            <a href="" class="application-button" target="_blank">Download Application</a>
                Download the application. Fill it out and upload below:
                <input type="file" name="fileToUpload" id="fileToUpload">
        </div>

        <div id="popErr"></div>
        <input type="hidden" name="nospam">
        <div class="field">  
        <div class="label-form">
        <input type="text" placeholder="Name *" value="" name="name" id="popName"> 
        <span class="form-icon fa fa-user"></span>
        </div>
        </div>
        <div class="field">  
        <div class="label-form">
        <input type="text" placeholder="Email *" value="" name="email" id="popEmail"> 
        <span class="form-icon fa fa-envelope"></span>
        </div>
        </div>
        <div class="field">  
        <div class="label-form">
        <input type="text" placeholder="Phone *" value="" name="phone" id="popTel">
        <span class="form-icon fa fa-phone"></span>
        </div>
        </div>

        <div id="submit_button">
        <input type="button" class="button submit" id="contact-submit" onclick="submitForm()" value="Request Information">
        </div>
     </form>
<script>
jQuery(document).ready(function($) {
    $("#chkJob").click(function () {
        if ($(this).is(":checked")) {
            $("#dvApply").show();
        } else {
            $("#dvApply").hide();
        }
    });
});
</script>

Answer 1

您可以在您的submitForm函数中实现此登录:

function submitForm()
{
    if ($('#chkJob').is(":checked")) {
        $("#dvApply").show();
    } else {
        $("#dvApply").hide();
    }
}

但是，如果您希望每次单击复选框按钮时都切换 dvApply 而不等待单击提交按钮，您可以执行以下操作:

jQuery(document).ready(function($) {
    $('#chkJob').change(function() {
        $('#dvApply').toggle();
    });
});