javascript - 调用 javascript 加载函数和 Controller 操作

Question

我试图在执行操作时显示“正在加载”页面。

在 View 中我有以下形式:

<div>
    <label class="bold center">
        Payment options
    </label>
    <div class="center">
        <div class="float-left">
            <label class="center bold">PayPal</label>
            <form id="payPal" action="@Url.Action("PaypalMethod")">
                <input type="image" name="submit"
                       src="~/Images/Functional/Icons/PayPal Pay.gif"
                       alt="PayPal — The safer, easier way to pay online." onclick="needToConfirm = false" />
            </form>
        </div>
        <div class="float-left">
            <label class="center bold">Credit Cards</label>
            <form id="credit" action="@Url.Action("CreditCardMethod")">
                <input type="image" name="submit"
                       src="~/Images/Functional/Icons/Credit cards.png"
                       alt="CreditCards" onclick="needToConfirm = false"/>
            </form>
        </div>
    </div>
</div>

我有这些 javascript 方法可用:

var spinnerVisible = false;

function ShowProgress() {
    if (!spinnerVisible) {
        $('div#spinner').fadeIn("fast");
        spinnerVisible = true;
    }
}
function HideProgress() {
    if (spinnerVisible) {
        var spinner = $('div#spinner');
        spinner.stop();
        spinner.fadeOut('fast');
        spinnerVisible = false;
    }
}

例如，当我单击第一个表单时，我想首先调用 ShowProgress() 方法，然后调用操作，最后调用 HideProgress() > 结果出现后或直接加载下一个 View 。

我怎样才能做到这一点？

Answer 1

您可以使用表单元素的onsubmit属性。

<form onsubmit="ShowProgress()">