Github源码：https://github.com/peachananr/loading-bar
<html>
<head>
<script type="text/javascript" src="jquery.loadingbar.js"></script>
<link rel="stylesheet" type="text/css" href="loadingbar.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(document).ready(function(){
$("#ajax-call").loadingbar({
done: function(data) {
$.each( data.shots, function( i, item ) {
$( "<img/>" ).attr( "src", item.image_teaser_url ).prependTo( $("#frame") );
if ( i === 11 ) {
return false;
}
});
}
});
});
</script>
<style>
.reload{
font-size: 14px;
font-family: "微软雅黑";
font-weight: bold;
}
</style>
</head>
<body>
<a id="ajax-call" href="http://www.baidu.com" class="reload">ajax-call</a>
<div id="frame"></div>
</body>
</html>
是不是下面的这些参数调用错了？
$(".ajax-call").loadingbar({
replaceURL: false, /* You can visibly change the URL of the browser to reflect the clicked links by toggling this to true. Default is false. May not work in old browsers. */
target: "#loadingbar-frame", /* The container's selector where you want the ajax result to appear. Default is #loadingbar-frame */
direction: "right", /* The direction where the the loading bar will progress. Default is right. */
/* Default Ajax Parameters. */
async: true,
complete: function(xhr, text) {},
cache: true,
error: function(xhr, text, e) {},
global: true,
headers: {},
statusCode: {},
success: function(data, text, xhr) {},
dataType: "html",
done: function(data) {}
});
