我在我的MVC应用程序中使用jQuery ajax版本1.4.1(虽然我讨论的问题与旧的jQuery版本3.2.1相同),在客户注册期间检查用户名是否已经注册.当用户点击"检查可用性"按钮时,我正在显示一个忙碌的图像来代替检查按钮(实际上隐藏了检查按钮并显示图像),同时检查服务器上的可用性,然后显示消息.这是一个Sync调用(async:false),我使用beforeSend:并完成:显示和隐藏忙图像和检查按钮.这个东西在Firefox上工作得很好,但在IE 8和Chrome中,既没有显示繁忙图像也没有隐藏检查按钮,而是因为整个事情都被绞死了,检查按钮仍然按下.但是,可用和不可用的消息正确显示.以下是代码:
用户控件中的HTML(ascx):
<div id="available">This Username is Available</div>
div id="not_available">This Username is not available</div>
<input id="txtUsername" name="txtUsername" type="text" size="50" />
<button id="check" name="check" type="button">Check Availability</button>
<img id="busy" src="/Content/Images/busy.gif" />
Run Code Online (Sandbox Code Playgroud)
在这个用户控件的顶部,我链接一个具有以下代码的外部JavaScript文件:
$(document).ready(function() {
$('img#busy').hide();
$('div#available').hide();
$('div#not_available').hide();
$("button#check").click(function() {
var available = checkUsername($("input#txtUsername").val());
if (available == "1") {
$("div#available").show();
$("div#not_available").hide();
}
else {
$("div#available").hide();
$("div#not_available").show();
}
});
});
function checkUsername(username) {
$.ajax({
type: "POST",
url: "/SomeController/SomeAction",
data: { "id": username },
timeout: 3000,
async: false,
beforeSend: function() {
$("button#check").hide();
$("img#busy").show();
}, …Run Code Online (Sandbox Code Playgroud)