My Tasks/Projects
Projects I Involved
New Task
My Jottings & Pics
Events I Attend
My Opportunities
laughee |
Jan 18, 2008 3:27:31 AM
在JQuery Frame中用remote方式调用javascript一般是用
$.get(<remote html url>, function(data){
$('#id').attr("innerHTML", data).evalScripts();
});
但是当去调用纯粹的javascript时，突然发现javascript代码无法运行，结果发现是Jquery的一个局限，
==〉如果要用evalsripts的话，必须在代码中至少出现一次<div></div>。否则javascript代码无法运行。
这种情况有些奇怪，但是的确发生了。
MOSS2007的一个特点是母板（master page）,推荐的用法基本上是在内容管理（content management）.
在本项目上结合javascript,设计了一个非常简约的母板架构
第一步 - 生成一个带有jquery的母板
存放在~\_catalogs\masterpage
代码如下
<%@ Master Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-tranditional.dtd">
<html>
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Expired" content="0" />
<meta http-equiv="progma" content="no-cache" />
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<link rel="stylesheet" type="text/css" href="/portal/_style/mycss.css" media="all" />
<script language="javascript" type="text/javascript" src="/portal/_style/jquery.js"></script>
<script language="javascript" type="text/javascript" src="/portal/_style/jquery.tabs.pack.js"></script>
<script language="javascript" type="text/javascript" src="/portal/_style/interface.js"></script>
<script language="javascript" type="text/javascript" src="/portal/_style/by1455.js"></script>
<script language="javascript" type="text/javascript" >
var ajaxcount = 0;
jQuery(document).ready(function() {
// add header
$.get("/by1455/viewlist.aspx?siteid=v3&list=Bookmark&view=Latest&xsl=header.xsl&mode=XMLno", function(data){
$('#header').html(data);
});
// add side
$.get("/by1455/alert.aspx?siteid=v3&mode=noXML", function(data){
$('#side1').html( $('#side1').html() + data );
});
$.get("/by1455/viewlist.aspx?siteid=v3&list=gottoknow&view=Visible&xsl=gottoknow.xsl&mode=XMLno", function(data){
$('#side2').html( $('#side2').html() + data );
});
$.get("/by1455/viewlist2.aspx?siteid=v3&list=bookmark&view=Latest&xsl=bookmark.xsl&list2=infocategory&view2=All&&mode=XMLno", function(data){
$('#side3').html( $('#side3').html() + data );
});
$.get("/by1455/viewlist.aspx?siteid=v3&list=activities&view=Work&xsl=activity.xsl&mode=noXML", function(data){
$('#side4').html( $('#side4').html() + data );
});
$.get("/by1455/viewlist.aspx?siteid=v3&list=Advertisement&view=Advert&xsl=Advert.xsl&mode=XMLpp", function(data){
$('#side5').attr("innerHTML", $('#side5').html() + data).evalScripts();
});
});
</script>
<title>My Portal</title>
</head>
<body class="internal">
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</body>
</html>
第二步 - 生成一个调用母板的程序下面是一个基于母板，通过url参数传递的应用,假设url是 /portal/bin/nav.aspx
<%@ Page Language="VB" masterpagefile="../_catalogs/masterpage/jquery.master" title="Myportal" %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div class="base" id="sub">
<div class="layout">
<script type="text/javascript" >
// add main
jQuery(document).ready(function() { var qStr = window.location.search.substring(1);
$.get(qStr, function(data){
$('#main').html( $('#main').html() + data );
});
});
</script>
<div class="header" id="header">
</div><!-- End of Header -->
<div class="clear"></div>
<div class="content">
<div class="side" id="side">
<div id="side1" class="side1" ></div>
<div id="side2" class="side2" ></div>
<div id="side3" class="side3" ></div>
<div id="side4" class="side4" ></div>
<div id="side5" class="side5"></div>
</div><!-- End of Side -->
<div class="main" id="main">
</div><!-- End of Main -->
<div class="clear"></div>
</div><!-- End of Content -->
<div class="clear"></div>
</div><!-- End of Layout -->
</div><!-- End of Base -->
</asp:Content>
第三步 - 生成子页
把任意的html或者其他的文件（例如 aspx）存入MOSS的Doc Lib中，假设url是 /portal/app/myhtml.htm
第四步 - 调用
只要简单用这个url就可以让母板和子页结合，/portal/bin/nav.aspx?/portal/app/html.htm
同样的母板和不同的子页，不同的母板和同样的子页可以有相当多的变化。
Tag: MOSS MOSS 企业内部门户网站开发周记
Comment:
(no reply)