0

我是 jquery 的新手，我需要弄清楚如何执行以下操作：

我的页面上有一个提交按钮，单击时会执行一个 jquery 函数。该函数将从 mysql 加载一些信息并用该信息回显一个表。

我的问题是这需要时间，同时用户正在等待甚至重新提交。

我想要的是在我开始从 mysql 获取数据之前显示一个弹出屏幕，并在数据回显到页面后将其删除。

我会寻找什么？这个叫什么？我怎样才能实现这样的想法。

这是我的代码：

<script type="text/javascript">
$(document).ready(function(){
$('#form-lecturer-login').submit(function(event){
event.preventDefault();
//I need: Display a pop up

//This is working : Code to fetch mysql data and echo a table

//I need: Remove popup
}

这是我的完整代码：pastebin.com/JVCfWbLD

4

3 回答 3

1

利用

 .blockUI() in jQuery .

我认为这将解决您的问题。

阻止用户界面

它会阻止屏幕，直到您取消阻止它。它是非常好的插件。

于 2013-03-01T04:20:18.387 回答
1

由于您实际上使用的是 jQuerysubmit而不是 AJAX，因此页面正在等待您的服务器端处理程序来处理数据。尝试这个：

将这两行放在<header>您的页面中：

<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js">
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">

然后修改您的代码，如下所示：

<script type="text/javascript">

       $(document).ready(function(){

           $(function() {
                $( "#dialog-modal" ).dialog({
                    height: 140,
                    modal: true,
                    autoOpen: false
           });

           $('#form-lecturer-login').submit(function(event) {
                event.preventDefault();

                $( "#dialog-modal" ).dialog( "open" );

                    //Your working processing code here.

                $( "#dialog-modal" ).dialog( "close" );
           }

       });

然后在您的 HTML 正文中：

<div id="#dialog-modal" title="Stand by...">
  <p>Your data is loading, please stand by...</p>
</div>
于 2013-03-01T04:36:55.490 回答
0

最好的方法是在用户提交时使用加载栏。这是一个演示

http://bokehman.com/loading

于 2013-03-01T04:28:12.990 回答