当前位置: 代码迷 >> ASP.NET >> jquery loading 加载效果 有关问题
  详细解决方案

jquery loading 加载效果 有关问题

热度:3353   发布时间:2013-02-25 00:00:00.0
jquery loading 加载效果 问题
下面是一个 loading 加载效果

<body>
<br />
<br />
<div style="margin:auto;border:1px solid #000;width:500px;height:20px;background:#eee;">
<div id="load" style="FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#333333', endColorStr='#000000', gradientType='0');background:#333;width:0;height:20px;color:#fff;font:normal 10px arial;line-height:20px;text-align:center">
</div>
</div>
<script type="text/javascript">
var $Load=document.getElementById('load');
!function Loading(x,y)
{
++x;
$Load.innerHTML=Math.floor(x/y*100)+'%';
$Load.style.width=x+"px";
x==y||setTimeout(function(){Loading(x,y)},10);
}(0,500);
</script>
</body>

我想把它整入项目里去,下面是我 用js 加载数据的js
PageClick = function (pageclickednumber) {
  jQuery.ajax({
  url: 'webashx/textcase.ashx',
  type: 'Get',
  data: { pageindex: pageclickednumber },
  success: function (data) {
  jQuery("#result").append(data);//这里绑定数据
  }
  });
}

我想在数据未加载完的时候 显示 loading 加载的效果,数据加载完就 loading 隐藏,显示数据,这个该怎么写?

------解决方案--------------------------------------------------------
beforeSend: function() { //dosomething }, // 数据加载完之前
------解决方案--------------------------------------------------------
比如:
JScript code
beforeSend: function() { $("#productTable")(""); $("#productTableBefore").show(); $("#Pagination").hide() }, // 发送数据之前complete: function() { $("#productTableBefore").hide(); $("#Pagination").show() }, // 接收数据完毕 // Ajax成功 success: function(json) {}
------解决方案--------------------------------------------------------
在你点击事件之前 ,做loading的效果
ajax请求成功,显示html
------解决方案--------------------------------------------------------
探讨

引用:

beforeSend: function() { //dosomething }, // 数据加载完之前


这个应该放在那里呢?
  相关解决方案