asp.net - gif 不显示在 jquery AjaxForm 中

Question

我试图在我的 ajax 调用期间显示图像。我正在使用 jqueryform 插件。我似乎无法找到正确的路径：我需要根路径，这是我的代码：

 $(function () {
                $("#ajaxUploadForm").ajaxForm({
                    iframe: true,
                    dataType: "json",
                    beforeSubmit: function () {
                        $("#ajaxUploadForm").block({ message: '<img src=' + '<%= @Url.Content("/Content/busy.gif") %>' + '/> Uploading Document...' });
                    },
                    success: function (result) {
                        $("#ajaxUploadForm").unblock();
                        $("#ajaxUploadForm").resetForm();
                        //$.growlUI(null, result.message);
                        if (result.message != 'Success') {
                            alert(result.message);
                        }
                        else {

                        }
                    },
                    error: function (xhr, textStatus, errorThrown) {
                        $("#ajaxUploadForm").unblock();
                        $("#ajaxUploadForm").resetForm();

                    }
                });
            });

Answer 1

试试这样：

$('#ajaxUploadForm').block({ 
    message: '<img src="<%= Url.Content("~/Content/busy.gif") %>" /> Uploading Document...' 
});

请注意，就好像这是在一个单独的 javascript 文件中一样，您将无法使用诸如Url.Content. 另一种可能性是使用 CSS：

$('#ajaxUploadForm').block({ 
    message: '<div class="spinner">Uploading Document...</div>' 
});

并且在您的 CSS 文件中，您可以使用相对路径（相对于 CSS 的位置）。因此，如果您有一个~/Content/site.css文件，您可以定义以下规则：

.spinner {
    background-image: url('busy.gif');
    width: 20px;
    height: 20px;
}