0

我正在创建一个调查。如果有人单击单选按钮（特别是“评级 4”或“评级 5”，我希望表单通过 ajax 提交。如果他们单击其他任何内容，我希望它引入 div #getMore 并且他们将通过提交提交按钮（通过 ajax/jquery）。

我有两个问题：

  1. ajax 适用于提交按钮，但在单击“评分 4”或“评分 5”时不起作用。
  2. 替换（）；不适用于两种类型的提交。

这是我的 jquery/ajax：

$(document).ready(function() {
    $('.rating').click(function() {
    $('.rating').removeClass('selected');
    ratingClick($(this)); // see function below...
});
});

//if rating 4 or rating 5 are clicked, submit (not working), else pull in questions 1 & 2//
function ratingClick(that) {
    console.log($(that).attr('for'));
        if ($(that).attr('for') == 'rating4' || $(that).attr('for') == 'rating5') {
            var $form = $('#questions');
            $form.submit(function(){
            $.post($(this).attr('connect.php'), $(this).serialize(), function(response){
            },'json');
            return false;
            $('#form').replaceWith( "<p>Thanks for your feedback!</p>" );
    });
    }
    else {
        $('#getMore').fadeIn();
        $(that).toggleClass('selected');
    }
}

// When 'submit' button is clicked, submit the form, and replace with "thank you" message (not working) //
$(document).ready(function(){
    var $form = $('#questions');
    $form.submit(function(){
    $.post($(this).attr('connect.php'), $(this).serialize(), function(response){
    },'json');
    return false;
    $('#form').replaceWith( "<p>Thanks for your feedback!</p>" );
});
});

这是我正在使用的表格（供参考）：

<div id = "form">
<form id="questions" action="connect.php" method="post">
<h2>How helpful is this article?</h2>
<div class="ratings">
    <input type="radio" name="Q1" id="rating1" value="1"><label class="rating" for="rating1">Not at all helpful</label>
    <input type="radio" name="Q1" id="rating2" value="2"><label class="rating" for="rating2">Not very helpful</label>
    <input type="radio" name="Q1" id="rating3" value="3"><label class="rating" for="rating3">Somewhat helpful</label>
    <input type="radio" name="Q1" id="rating4" value="4"><label class="rating" for="rating4">Very helpful</label>
    <input type="radio" name="Q1" id="rating5" value="5"><label class="rating" for="rating5">Extremely helpful</label>
</div>
<div id="getMore">
    <h2>Please tell us why you didn't find this article helpful:</h2>
        <input type='checkbox' name="Q2_1" value="1">Not related to my issue<br/>
        <input type='checkbox' name="Q2_2" value="1">Too complicated explanations<br/>
        <input type='checkbox' name="Q2_3" value="1">Too much information<br/>
        <input type='checkbox' name="Q2_4" value="1">Incorrect information<br/>
        <input type='checkbox' name="Q2_5" value="1">Unclear information<br/>
        <input type='checkbox' name="Q2_6" value="1">Incomplete information<br/>
        <h2>Do you have any other feedback about this article?</h2>
        <p><input type="text" name="Q3" /><p>
    <div id = "submit"><input type='submit' value="Submit" /></div>
</div>
</form>

我被卡住了，非常感谢一些帮助！

编辑：替换（）；现在正在工作，只需将其放在 return false 之上；（感谢之前评论的人）

4

0 回答 0