Question

我有一个带有三个单选按钮和一个复选框设置的表单。用户必须单击一个单选按钮并单击复选框才能提交。我正在使用WP-Polls这是WordPress的插件。由于某种原因，表格不会提交。我单击一个单选按钮，单击复选框，但点击提交不执行任何操作。可以看到实时网站here。相关部分是最黑暗的投票部分。

HTML

<form id="polls_form_1" class="wp-polls-form" action="/index.php" method="post">
    <p style="display: none;"><input type="hidden" id="poll_1_nonce" name="wp-polls-nonce" value="12a6404147"></p>
    <p style="display: none;"><input type="hidden" name="poll_id" value="1"></p>
    <div id="polls-1-ans">
    <ul>
        <li><input type="radio" id="poll-answer-1" name="poll_1" value="1"></li>
        <li><input type="radio" id="poll-answer-2" name="poll_1" value="2"></li>
        <li><input type="radio" id="poll-answer-3" name="poll_1" value="3"></li>
    </ul>

    <label class="check-terms"><input type="checkbox">I am over 18 and I have read and understand the Terms of Use</label>

    <input type="submit" name="vote" value="Vote" class="Buttons" />
</form>

的JavaScript

$(function() {
    window.poll_vote = function(num) {
        console.log(num);
    }

    $('.wp-polls-form').submit(function(e) {

        if (!$('input:radio', this).is(':checked')) {
            alert('Please pick a beat.');
            return false;
        }

        if (!$('input:checkbox', this).is(':checked')) {
            alert('Please agree to the Terms of Use.');
            return false;
        }

        poll_vote(1);

        return false;
    });
});

以下是poll_vote(1)的功能：

// When User Vote For Poll
function poll_vote(current_poll_id) {
    jQuery(document).ready(function($) {
        if(!is_being_voted) {
            set_is_being_voted(true);
            poll_id = current_poll_id;
            poll_answer_id = '';
            poll_multiple_ans = 0;
            poll_multiple_ans_count = 0;
            if($('#poll_multiple_ans_' + poll_id).length) {
                poll_multiple_ans = parseInt($('#poll_multiple_ans_' + poll_id).val());
            }
            $('#polls_form_' + poll_id + ' input:checkbox, #polls_form_' + poll_id + ' input:radio, #polls_form_' + poll_id + ' option').each(function(i){
                if ($(this).is(':checked') || $(this).is(':selected')) {
                    if(poll_multiple_ans > 0) {
                        poll_answer_id = $(this).val() + ',' + poll_answer_id;
                        poll_multiple_ans_count++;
                    } else {
                        poll_answer_id = parseInt($(this).val());
                    }
                }
            });
            if(poll_multiple_ans > 0) {
                if(poll_multiple_ans_count > 0 && poll_multiple_ans_count <= poll_multiple_ans) {
                    poll_answer_id = poll_answer_id.substring(0, (poll_answer_id.length-1));
                    poll_process();
                } else if(poll_multiple_ans_count == 0) {
                    set_is_being_voted(false);
                    alert(pollsL10n.text_valid);
                } else {
                    set_is_being_voted(false);
                    alert(pollsL10n.text_multiple + ' ' + poll_multiple_ans);
                }
            } else {
                if(poll_answer_id > 0) {
                    poll_process();
                } else {
                    set_is_being_voted(false);
                    alert(pollsL10n.text_valid);
                }
            }
        } else {
            alert(pollsL10n.text_wait);
        }
    });
}

Answer 1

问题是在表单中添加的新复选框（条款和条件）。

如果您可以更改poll_vote功能...

更改

<label class="check-terms"><input type="checkbox">

到

<label class="check-terms"><input type="checkbox" class="check-terms">

然后

a("#polls_form_" + poll_id + " input:checkbox, #polls_form_" + poll_id + " input:radio, #polls_form_" + poll_id + " option")

到

a("#polls_form_" + poll_id + " input:checkbox, #polls_form_" + poll_id + " input:radio, #polls_form_" + poll_id + " option").not('.check-terms')

用户选中单选按钮和复选框后，表单将无法提交

1 个答案: