当前位置：首页 → 问答吧 → 请教一个Ajax的很简单的效果

请教一个Ajax的很简单的效果

时间：2010-05-17

来源：互联网

比如有两个html文件，1.html && 2.html 当我点击页面上某个连接时出现一句提示“一个图片和正在加载数据。。。” 请问这怎么实现的？

作者: ixiaoyu 发布时间: 2010-05-17

点击触发事件- 把loading层显示，同时进行ajax操作。
当ajax请求完成，隐藏loading层，显示数据之前

或者是把加载层放入层内

作者: lyh6631791 发布时间: 2010-05-17

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> #loading{background:#f00;display:none;} </style> <script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $('#send').click(function() { $.ajax({ type: "GET", url: "2.html", success : function(data){ $('#show').html(data) } }); }); $("#loading").ajaxStart(function(){ $(this).show(); }); $("#loading").ajaxStop(function(){ $(this).hide(); }); }) </script> </head> <body> <br/> <div id="loading">加载中...</div> <input type="button" id="send" value="加载"/> <div id="show"></div> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 leafage2006 于 2010-5-17 23:29 编辑 ]

作者: leafage2006 发布时间: 2010-05-17

请教一个Ajax的很简单的效果

热门阅读

热门下载