我想仅当用户单击我的 html 表单上的提交
时才显示进度图像加载器
,但目前进度图像加载器<当用户
...所以我想将事件仅隔离为单击的按钮重新加载
页面时,也会显示(提交)
,而无需当用户
。我提供了一个示例来展示我在纯 JavaScript 中寻找的内容。 重新加载
页面时显示>进度图像加载器
感谢任何帮助。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta name="pragma" content="no-cache">
<meta name="robots" content="noindex, nofollow">
<title>BackUp</title>
<link rel="stylesheet" type="text/css" href="backup.css">
<script language="javascript" type="text/javascript">
function StartProgress() {
ProgressImage = document.getElementById('progress_image');
document.getElementById("progress").style.display = "block";
setTimeout("ProgressImage.src = ProgressImage.src", 100);
return true;
}
</script>
</head>
<body onUnload="StartProgress()">
<div class="mainbox">
<div class="box1">
<span class="title">BackUp</span>
</div>
<div class="cleardiv"></div>
<div class="box2">
<form onSubmit="return StartProgress()" action="backup.php" method="post">
<input class="backup_button" type="submit" name="submit" value="BackUp">
</form>
</div>
<div class="cleardiv"></div>
<div style="display: none" id="progress"><img id="progress_image" src="css/busy.gif" alt="BackUp in progress..."></div>
<div class="cleardiv"></div>
</div>
</body>
</html>
最佳答案
你可以试试这个:
将您的表单更改为如下所示:
<form id='form1' action="backup.php" method="post">
<input type='button' onclick='submitForm()' value="BackUp" />
</form>
提交表单函数:
function submitForm() {
StartProgress();
var form1 = document.getElementById('form1');
form1.submit();
//setTimeout(function(){
// form1.submit();
//}, 1000);
}
关于javascript - 仅当用户单击提交 html 表单时,纯 javascript 中的进度图像加载器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28794639/