ночи всем,
У меня проблема с применением этого сценария в веб-форме ASP.Net и последней библиотеке Jquery (jquery-3-3-1) для отображения индикатора выполнения (исходная ссылка взята с с этого сайта )
<script src="Scripts/jquery-3.3.1.min.js"></script>
<script src="Scripts/jquery-ui-1.12.1/jquery-ui.min.js"></script>
<link href="CSS/jquery-ui-themes-1.12.1/themes/excite-bike/jquery-ui.min.css" rel="stylesheet" />
<style type="text/css">
.modal {
position: fixed;
top: 0;
left: 0;
background-color: black;
z-index: 99;
opacity: 0.8;
filter: alpha(opacity=80);
/*-moz-opacity: 0.8;*/
min-height: 100%;
width: 100%;
}
.loading {
font-family: Arial;
font-size: 10pt;
border: 5px solid #67CFF5;
width: 200px;
height: 130px;
display: none;
position: fixed;
background-color: White;
z-index: 999;
}
</style>
<script type="text/javascript">
function ShowProgress() {
setTimeout(function () {
var modal = $('<div />');
modal.addClass("modal");
$('body').append(modal);
var loading = $(".loading");
loading.show();
var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
loading.css({ top: top, left: left });
}, 200);
}
//Deprecated
//$('form').live("submit", function () {
// ShowProgress();
//});
$('form').on("submit", function () {
ShowProgress();
});
</script>
Возможно, одна из проблем заключается в том, что .live () устарела, потому что когда я использую старый jquery ниже, скрипт работает хорошо.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
И затем я пытаюсь заменить две из этих команд в последней версии jquery-3.3.1, как сказано в документации API, оба сценария по-прежнему не будут запускаться:
$('form').on("submit", function () {
ShowProgress();
});
и с этим:
$('form').submit(function () {
ShowProgress();
});
Так что, пожалуйста, помогите, что за идея решить эту проблему?
Извините за мой плохой английский и с наилучшими пожеланиями за советы.