Я использую jQuery ajax версия 1.4.1 в моем приложении MVC (хотя вопрос, который я обсуждаю, был тем же со старой версией 3.2.1 jQuery) также для проверки во время клиентской регистрации, если имя пользователя уже регистрируется. Поскольку пользователь нажимает на кнопку "Check Availibility", я показываю занятое изображение вместо кнопки проверки (на самом деле скрывающий кнопку проверки и показывающий изображение) при проверке availibility на сервере и затем отображении сообщения. Это - Синхронизирующий вызов (асинхронный: ложь) и я использовал 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" />
На вершине этого пользовательского элемента управления я связываю внешний файл 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();
},
complete: function() {
$("button#check").show();
$("img#busy").hide();
},
cache: false,
success: function(result) {
return result;
},
error: function(error) {
$("img#busy").hide();
$("button#check").show();
alert("Some problems have occured. Please try again later: " + error);
}
});
}
Я нашел ответ на свой вопрос. На самом деле это был вызов синхронизации (async = false), который сводил IE с ума. Я удалил это и скорректировал код, и теперь все работает нормально.