首先，我不擅长 jQuery。我已经阅读了这两个涉及该主题的问题：
但我想知道当我点击我网站上的内部链接时如何设法显示“正在加载文本/图像”？我有一个在 PHP 中运行 curl 获取函数的链接，需要一段时间才能运行。
如果您有一个 Ajax 函数，上面的示例（链接）将处理该主题。不只是一个链接，我不想要。
我怎样才能做到这一点？
【问题讨论】：
标签： jquery
HTML
<a href="someotherpage.php" >Your Link</a>
脚本
$(function(){
$("a").click(function(){
$(this).after("<img src='loading_image.gif' alt='loading' />").fadeIn();
});
});
当用户单击该链接时，此代码将在每个链接后添加加载图像。
工作示例：http://jsfiddle.net/YjWWX/3/
你可以从http://www.ajaxload.info获取一些加载图片
【讨论】：
$(document).ready(function(){ $("a").click(function(){ $(this).after("<img src='http://www.mcso.us/paid/images/ajax_load.gif' alt='loading' />").fadeIn(); return false; // comment out this to for the link to work }); });
CSS：
#spinner
{
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url(Images/Loading.gif) 50% 50% no-repeat #ede9df;
}
JS：
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$("#spinner").fadeOut("slow");
});
</script>
HTML：
<!-- HTML -->
<div id="spinner"> </div>
【讨论】：
您需要在 Jquery 中使用 .on() 函数附加点击事件。
<a href='#' div='mylink'>
<div id='loading' style=display:none'>loading...</div>
<script type="text/javascript">
$('#mylink').on('click',$('#loading).show());
</script>
然后当你完成加载后，你会想要发出：
$('#loading').hide();
【讨论】：
$(window).load(function() { $(".loader").fadeOut("slow"); })
css:
.loader { 位置：固定；左：0px；顶部：0px；宽度：100%；高度：100%； z指数：9999；背景：url('images/page-loader.gif') 50% 50% no-repeat rgb(249,249,249); }
html: 注意声明 div class='loader'
【讨论】：
第 1 步 => 在 master/layout.cshtml 中声明 div 就像
<div class="loader"></div>
第 2 步 => 添加 css ：
.loader{position:fixed;left:0;top:0;width:100%;height:100%;z-index:9999;background:url(../images/loader.gif) 50% 50% no-repeat #000;opacity:.75}
步骤 3=> 添加以下 javascript
$(window).on(function () {
$(".loader").fadeOut("slow");
});
! function (a)
{
jQuery(window).bind("unload", function () { }), a(document).ready(function () {
a(".loader").hide(), a("form").on("submit", function () {
a("form").validate(), a("form").valid() ? (a(".loader").show(), a("form").valid() || a(".loader").hide()) : a(".loader").hide()
}), a('a:not([href^="#"])').on("click", function () {
"" != a(this).attr("href") && a(".loader").show(), a(this).is('[href*="Download"]') && a(".loader").hide()
}), a("a:not([href])").click(function () {
a(".loader").hide()
}), a('a[href*="javascript:void(0)"]').click(function () {
a(".loader").hide()
}), a(".export").click(function () {
setTimeout(function () {
a(".loader").fadeOut("fast")
}, 1e3)
})
})
}(jQuery);
【讨论】：
对加载器使用fadeOut()方法并将其保存在$(window).load()方法中。
【讨论】：