如何使用 js 在 load() 过程中显示加载图像
How to show loading image at load() proccess with js
我想在我的页面中显示加载图像。我有一个load()
函数,我需要在加载时在页面中心显示加载图像,并且我正在使用带有骨干路由器的 load()。
我想我需要 javascript 来做到这一点,但我不知道如何仅在 load() 进程中显示它。
**You can use in this way**
function showLoadingMsg() {
$('#loading-message').css({
display : 'block'
});
}
function hideLoadingMsg() {
$('#loading-message').remove();
}
**the place where you want to show loading gif**
<!--loding image goes here-->
<div style="display:none" id="loading-message"><img src="<?php echo base_url(); ?>assests/img/loading.gif" /></div>
**When to show and hide should be in**
obj.fbId ="14232";
showLoadingMsg();
$.post("<?= base_url() ?>welcome/insertVideos",obj,
function(success){
hideLoadingMsg();
}, "json");
我也是php开发人员,我使用jquery做了这件事。你可以通过Jquery使用它,就像这样:-只需确认您的 jquery 脚本存在即可。
<div id="popup1" class="popup_block">
<?php echo $this->Html->image('loader2.gif'); ?>
<h4>Processing Please Wait...! </h4>
</div>
你必须调用这个函数
function open_loader(){
if(enrollFlag==0){
return false;
}
//Fade in Background
jQuery('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
jQuery('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer
var popID = 'popup1';
//var popWidth = 500;
//Fade in the Popup and add close button
jQuery('#' + popID).css({ 'width': '250' });
//Define margin for center alignment (vertical + horizontal) - we add 80 to the height/width to accomodate for the padding + border width defined in the css
var popMargTop = (jQuery('#' + popID).height() + 80) / 2;
var popMargLeft = (jQuery('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
jQuery('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft,
'display' : 'block'
});
}
此函数将在执行时显示加载程序图像。
或者如果你坚持load()
这样做:-
<input type="button" onclick="example_request()" value="Click Me!" />
<div id="example-placeholder">
<p>Placeholding text</p>
</div>
function example_ajax_request() {
$('#example-placeholder').html('<p><img src="/images/loader.gif" width="220" height="19" /></p>');
$('#example-placeholder').load("/examples/loaded.html");
}
假设你有一个带有图像标签的div。如果您有 ajax 请求,您可以像这样显示或隐藏div...(将此代码放在 .ready 函数上)
$('#loadingDiv')
.hide() // hide it initially
.ajaxStart(function() {
$(this).show();
})
.ajaxStop(function() {
$(this).hide();
});
如果你没有 ajax 调用,那就这样使用......
function Load()
{
$('#loadingDiv').hide(); // hide it initially
$('#loadingDiv').show() ;
//-------------Your code here of form loading------
//-------------Your code here of form loading------
//-------
//-------
$('#loadingDiv').hide();// hide it in the last
}
相关文章:
- 使用电话间隙在Android应用程序中显示SQL Lite的数据
- 无法在JS中显示谷歌地图
- 如何在按钮中显示下拉列表中选定的元素
- 需要帮助谷歌地图方向面板在FancyBox中显示
- 是什么让一个“;Uncaught RangeError:超过了最大调用堆栈大小“;错误(Chrome,在其他浏览器中显示
- 如何在HTML中显示服务器对象变量
- 在select元素中显示highchart dashstyle(svg)
- 在ng重复循环中显示来自不同文件夹的图像
- 在电子商务结账过程中显示特定于上下文的错误
- 在asp.net页面中显示javascript执行过程中的加载图标
- 在渲染过程中显示GIF图像
- 在查找过程中显示隐藏的文本
- ng-repeat在执行过程中显示不同的值
- 如何使用 js 在 load() 过程中显示加载图像
- 滚动过程中的错误行为,根据代码的链接方式显示
- Facebook如何在AJAX页面加载过程中显示浏览器加载进度
- 在电子渲染过程中显示.icns文件
- 如何在内存AngularJS处理过程中显示图像
- 如何使PHP shuffle结果在整个shuffle过程中一次显示一个
- 高图,显示在缩放过程中跟随选定点的文本