jQuery Div中加载其他页面的实现代码


Posted in Javascript onFebruary 27, 2009

经过一翻尝试,终于找到了一个自大比较满意的解决方法,现写在自己的博客中与大家分享。
第一步需要在签核页面中提供一个区域用来显示表单内容,这里使用的是DIV。

<script type="text/javascript"> 
$(document).ready(function() { 
loadPage("doc_view", "<?php echo $this->doc_view_url . '/flag/1'; ?>"); 
}); 
</script> 
<?php 
$p = new Portlet(); 
$p->setCaption("Document View") 
->setShowBorder(false) 
->addItem("<div id='doc_view'></div>") //这个DIv就是用来显示表单内容的容器 
->render(); 
echo $this->partial("approval/CommentsList.phtml", array("approval_list" => $this->approval_list)); 
?>

第二步就是编写一段JavaScript用来获取表单页面,使用jQuery
//动态加载页面 
//id 显示页面的容器组件ID 
//url 欲加载页面网址 
function loadPage(id, url) { 
$("#"+id).addClass("loader"); 
$("#"+id).append("Loading......"); 
$.ajax({ 
type: "get", 
url: url, 
cache: false, 
error: function() {alert('加载页面' + url + '时出错!');}, 
success: function(msg) { 
$("#"+id).empty().append(msg); 
$("#"+id).removeClass("loader"); 
} 
}); 
}
Javascript 相关文章推荐
用javascript实现给出的盒子的序列是否可连为一矩型
Aug 30 Javascript
json对象转字符串如何实现
Dec 02 Javascript
控制页面按钮在后台执行期间不重复提交的JS方法
Jun 24 Javascript
JavaScript实现存储HTML字符串示例
Apr 21 Javascript
深入理解javascript构造函数和原型对象
Sep 23 Javascript
jquery中ajax使用error调试错误的方法
Feb 08 Javascript
javascript cookie基础应用之记录用户名的方法
Sep 20 Javascript
jQuery无缝轮播图代码
Dec 22 Javascript
Angular实现预加载延迟模块的示例
Oct 12 Javascript
javascript实现获取一个日期段内每天不同的价格(计算入住总价格)
Feb 05 Javascript
微信小程序实现倒计时调用相机自动拍照功能
Jun 10 Javascript
解决vue单页面修改样式无法覆盖问题
Aug 05 Javascript
jQuery 使用个人心得
Feb 26 #Javascript
javascript div 弹出可拖动窗口
Feb 26 #Javascript
javascript URL锚点取值方法
Feb 25 #Javascript
javascript 特殊字符串
Feb 25 #Javascript
javascript 密码强弱度检测万能插件
Feb 25 #Javascript
javascript 常用代码技巧大收集
Feb 25 #Javascript
input、button的不同type值在ajax提交表单时导致的陷阱
Feb 24 #Javascript
You might like
php的array数组和使用实例简明教程(容易理解)
2014/03/20 PHP
Yii框架调试心得--在页面输出执行sql语句
2014/12/25 PHP
PHP自定义函数判断是否为Get、Post及Ajax提交的方法
2017/07/27 PHP
PHP简单验证码功能机制实例详解
2019/03/27 PHP
PHP使用Redis实现Session共享的实现示例
2019/05/12 PHP
JavaScript Event学习第二章 Event浏览器兼容性
2010/02/07 Javascript
jQuery中绑定事件的命名空间详解
2011/04/05 Javascript
javascript对select标签的控制(option选项/select)
2013/01/31 Javascript
js清除input中type等于file的值域(示例代码)
2013/12/24 Javascript
js 连续赋值的简单实现
2016/06/13 Javascript
JavaScript随机生成颜色的方法
2016/10/15 Javascript
值得分享的JavaScript实现图片轮播组件
2016/11/21 Javascript
js实现登录框鼠标拖拽效果
2017/03/09 Javascript
JS数组去重(4种方法)
2017/03/27 Javascript
了解VUE的render函数的使用
2017/06/08 Javascript
原生JS实现小小的音乐播放器
2017/10/16 Javascript
js通过Date对象实现倒计时动画效果
2017/10/27 Javascript
jQuery实现动态添加和删除input框实例代码
2019/03/26 jQuery
JavaScript Date对象功能与用法学习记录
2020/04/28 Javascript
Ant Design的Table组件去除
2020/10/24 Javascript
[14:21]VICI vs EG (BO3)
2018/06/07 DOTA
python计算牛顿迭代多项式实例分析
2015/05/07 Python
详解Python中的from..import绝对导入语句
2016/06/21 Python
详解python如何在django中为用户模型添加自定义权限
2018/10/15 Python
pygame实现贪吃蛇游戏(上)
2019/10/29 Python
Pytorch 多块GPU的使用详解
2019/12/31 Python
浅谈tensorflow中dataset.shuffle和dataset.batch dataset.repeat注意点
2020/06/08 Python
Python的3种运行方式:命令行窗口、Python解释器、IDLE的实现
2020/10/10 Python
python 视频下载神器(you-get)的具体使用
2021/01/06 Python
马来西亚最大的在线隐形眼镜商店:MrLens
2019/03/27 全球购物
我为自己代言广告词
2014/03/18 职场文书
关于爱国的演讲稿
2014/05/07 职场文书
安全教育第一课观后感
2015/06/17 职场文书
2016年第29个世界无烟日宣传活动总结
2016/04/06 职场文书
2019客服个人年终工作总结范文
2019/07/08 职场文书
SQL中的三种去重方法小结
2021/11/01 SQL Server