jquery - 提交时替换表格

Question

我有一个场景，当用户提交表单时，我希望表单切换并替换为答案的解释时，将向用户展示一个多项选择问题。

我有以下观点

<script type="text/javascript">
$(document).ready(function () {

    $('#answerForm').submit(function () {
        $.ajax({
            type: this.method,
            url: this.action,
            data: $(this).serialize(),
            success: function (result) {
                $("#question").toggle(1000);
                $("#answer").toggle(1000);
            }
        });
        //alert("Submitted");
        return false;
    });

});

<div id="question">
    <span id="question-display">@Model.Question</span>

    <div class="answer-section">
        @using (Html.BeginForm("Index", "", FormMethod.Post, new { id = "answerForm" }))
        {
            for (int i = 0; i < Model.Responses.Count; i++)
            {
                    <div class="reponse">@Html.RadioButtonFor(m => m.SelectedIndex, i, new { @class = "response-radio" })@Model.Responses[i]</div>
            }
            <input id="submit-button" type="submit" value="Answer" />                              
        }

    </div>
    <div id="testResponse">Form not submitted</div>
</div>
<div id="answer" style="display:none">
    @Model.Explanation
</div>

问题是，虽然我的表单提交没有按预期导致重定向，但 js 中的“成功”函数中的代码似乎没有执行。

控制器：

public ActionResult Index()
    {
        QuizModel model = new QuizModel()
        {
            Question = "This is the question",
            Explanation = "This is the explanation",
            UserHasAnswered = false
        };

        return PartialView(model);
    }

    //
    // POST: /Quiz/Submit
    [HttpPost]
    public ActionResult Index(QuizModel model)
    {
        if (ModelState.IsValid)
        {
            int? selected = model.SelectedIndex;

            model.UserHasAnswered = true;
            model.Explanation = "Explication";

            return Json(new
            {
                success = true,
            });

        }

        return Json(new
        {
            success = false,
        });
    }