命令“ show()”在jQuery提交表单中不起作用?

| 最简单的示例是当用户单击“提交”时,我想显示一个div,其中有一个gif,指示正在发送邮件。 Javascript:
//Send mail
$(\"div.contato-pedidooracao form\").submit(function () {

    $(\".sending\").show(); //HERE.. DONT WORK!!  why??
    $(\".contato-pedidooracao form\").hide(); //THIS WORKS!!

    var dataString = $(this).serialize();
    $.ajax({
        type: \"POST\",
        url: \"Contato/SendMail\",
        data: dataString,
        dataType: \"json\",
        success: function (data) {
            $(\".sendMessage\").empty();
            $(\".sendMessage\").append(\"<p>Mensagem enviada com sucesso</p>\")
            $(\".sendMessage\").append(\"<p>Rezaremos por você!</p>\")
            $(\".sendMessage\").show();
        },
        error: function (xhr, ajaxOptions, thrownError) {
            $(\".sendMessage\").empty();
            $(\".sendMessage\").append(\"<p>Ocorreu um erro ao tentar enviar a mensagem</p>\")
            $(\".sendMessage\").append(\"<p>Por favor, tente novamente mais tarde.</p>\")
            $(\".sendMessage\").show();
            $(\".contato-pedidooracao form\").show();
        }
    });
    $(\".sending\").hide();
    event.preventDefault();

});
的HTML
<div class=\"content contato-pedidooracao\">
    @using (Html.BeginForm())
    {
        <p>Conte-nos seu pedido</p>
        <div class=\"inline\">
            @Html.Label(\"name\", \"Nome:\")
            @Html.TextBox(\"name\", \"\")
        </div>
        <div class=\"inline\">
            @Html.Label(\"phone\", \"Telefone:\")
            @Html.TextBox(\"phone\", \"\", new { @class = \"phone\" })
            @Html.TextBox(\"cel\", \"\", new { @class = \"phone\" })
        </div>
        <div class=\"inline\">
            @Html.Label(\"email\", \"e-mail:\")
            @Html.TextBox(\"email\", \"\", new { @class = \"email\" })
        </div>
        <div class=\"inline\">
            @Html.Label(\"message\", \"Mensagem:\")
            @Html.TextArea(\"message\", \"\")
        </div>
        <div class=\"submit\">
            <input type=\"submit\" value=\"Enviar\" title=\"Enviar\" />
        </div>
    }
    <div class=\"message sending\">
        <p>Enviando mensagem</p>
        <img src=\"@Href(\"~/Images/ajax-loader.gif\")\" alt=\"Enviando...\" />
    </div>
    <div class=\"message sendMessage\"></div>
</div>
我不知道它是否相关..而是CSS的一部分:
div.column > div.contato-pedidooracao > div.message
{
    display:none;
}
.sending, .sendMessage
{
    text-align:center;
}
处理平均需要5秒钟,但在此时间间隔内不会出现
div.sending
。     
已邀请:
        这是因为AJAX是异步的,JS不会等待它。因此放在AJAX之后的ѭ4实际上是在ѭ5之后执行的。 尝试将ѭ4放在AJAX成功和错误功能的末尾。     

要回复问题请先登录注册