Question

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

我遇到两个问题：

ajax适用于提交按钮，但不会在点击“评级4”或“评级5”时使用。
replaceWith（）;不适用于任何类型的提交。

这是我的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>

我很卡住，真的很感激一些帮助！

编辑：replaceWith（）;现在正在工作，只是把它放在返回假的上方; （感谢先前评论过的人）

按单选按钮提交单击（通过ajax）和replaceWith（）;不工作

0 个答案: