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 相关文章推荐
10个新的最有前途的JavaScript框架
Mar 12 Javascript
JavaScript 动态创建VML的方法
Oct 14 Javascript
jquery text()要注意啦
Oct 30 Javascript
javascript 节点遍历函数
Mar 28 Javascript
JQuery 1.3.2以上版本中出现pareseerror错误的解决方法
Jan 11 Javascript
JavaScript实现查找字符串中第一个不重复的字符
Dec 29 Javascript
超级简单实现JavaScript MVC 样式框架
Mar 24 Javascript
javascript模拟php函数in_array
Apr 27 Javascript
Jquery代码实现图片轮播效果(一)
Aug 12 Javascript
bootstrap-table+treegrid实现树形表格
Jul 26 Javascript
vue之封装多个组件调用同一接口的案例
Aug 11 Javascript
基于JQuery和DWR实现异步数据传递
Oct 16 jQuery
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和ACCESS写聊天室(四)
2006/10/09 PHP
帖几个PHP的无限分类实现想法~
2007/01/02 PHP
WebQQ最新登陆协议的用法
2014/12/22 PHP
33道php常见面试题及答案
2015/07/06 PHP
PHP远程调试之XDEBUG
2015/12/29 PHP
[原创]PHP获取数组表示的路径方法分析【数组转字符串】
2017/09/01 PHP
在 Laravel 项目中使用 webpack-encore的方法
2019/07/21 PHP
laravel 框架执行流程与原理简单分析
2020/02/01 PHP
TP5框架页面跳转样式操作示例
2020/04/05 PHP
用于判断用户注册时,密码强度的JS代码
2009/01/01 Javascript
JavaScript常用全局属性与方法记录积累
2013/07/03 Javascript
JS实现浏览器状态栏文字从右向左弹出效果代码
2015/10/27 Javascript
Javascript简单实现面向对象编程继承实例代码
2015/11/27 Javascript
jQuery each函数源码分析
2016/05/25 Javascript
JQuery异步加载PartialView的方法
2016/06/07 Javascript
Bootstrap 3 按钮标签实例代码
2017/02/21 Javascript
label+input实现按钮开关切换效果的实例
2017/08/16 Javascript
详解Vue SPA项目优化小记
2018/07/03 Javascript
浅谈vue引用静态资源需要注意的事项
2018/09/28 Javascript
利用Angular7开发一个Radio组件的全过程
2019/07/11 Javascript
详解小程序云开发攻略(解决最棘手的问题)
2019/09/30 Javascript
小程序实现简单语音聊天的示例代码
2020/07/24 Javascript
[50:50]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第一场 12.20
2020/12/23 DOTA
Python用Pillow(PIL)进行简单的图像操作方法
2017/07/07 Python
python正则实现计算器功能
2017/12/14 Python
python ansible服务及剧本编写
2017/12/29 Python
详解Django模版中加载静态文件配置方法
2019/07/21 Python
使用Django搭建网站实现商品分页功能
2020/05/22 Python
Python中bisect的用法及示例详解
2020/07/20 Python
详解用python -m http.server搭一个简易的本地局域网
2020/09/24 Python
荷兰之家英文站:Holland at Home
2016/10/26 全球购物
SIDESTEP荷兰:在线购买鞋子
2019/11/18 全球购物
2014年两会学习心得体会
2014/03/10 职场文书
小学语文教研活动总结
2014/07/01 职场文书
基层组织建设年活动总结
2015/05/09 职场文书
新闻报道稿范文
2015/07/23 职场文书