Question

页面（http://www.squishypig.com/ft/uploads/）有一个上传脚本（如下所示）我希望能够在用户点击提交以提交文件时显示加载图片。

以下是相关代码：

<td width="500">
</td>
</tr>
</table>
<center>
<p>
<table>
<tr>
<td bgcolor="white">
<form action="/cgi-bin/upload.cgi" method="post" enctype="multipart/form-data">
<input type="File" name="FILE1">
<p>
<input type="File" name="FILE2">
<p>`
<input type="File" name="FILE3">
<p>
<input type="File" name="FILE4">
<p>
<input type="File" name="FILE5">
<p>
<input type="File" name="FILE6">
<p>
<input type="File" name="FILE7">
<p>
<input type="File" name="FILE8">
<p>
<input type="File" name="FILE9">
<p>
<input type="File" name="FILE10">
<p>

<input type="Submit" value="submit">

</form>
</td>
</tr>
</table>
</center>

我想要显示一个＆＃39; loading＆＃39;单击提交按钮时的图像，但仍然保留旧功能（上传）。

提前致谢，马特

Answer 1

您可以使用Ajax提交表单数据并显示图像

使用jquery的东西

$("#submitBtn").click(function(){
    $("#loadingImage").show(); //show the loading image
    $.post('/cgi-bin/upload.cgi',{yourdata}, {callback}) // submit your form, after the success of submission you can hide the image using hide() method
})

在jquery docs上查看$ .post的更多内容，希望有所帮助！

谢谢， Dhiraj

Answer 2

Add Following code to page

<input type="Submit" value="submit" onclick="$('#loading').show();">

<div id="loading" style="display:none;"><img src="loading.gif" alt="" /></div>

单击按钮时显示和图像（重新提交）

2 个答案: