打开Dreamweaver,依次选择“插入”-->“布局对象”-->“Spry选项卡式面板”。将会自动生成下面的代码：
......
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">标签 1</li>
<li class="TabbedPanelsTab" tabindex="0">标签 2</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">内容 1</div>
<div class="TabbedPanelsContent">内容 2</div>
</div>
</div>
<script type="text/javascript">
//如果想手动设置显示哪个选项卡(索引从0开始)以及满足某些条件时候disabled指定选项卡，可以参考下面代码：
var tabbedPanels = new Spry.Widget.TabbedPanels("TabbedPanels1");
var tabbedPanelsFlag= '${tabbedPanelsFlag}';
if(tabbedPanelsFlag==1){
tabbedPanels .showPanel(1);
}
var copy = '${actionBean.params.copy}';
if(copy=="copy"){
//$(MasterTabbedPanels.getTabs()[1]).click(function(){//not IE
//MasterTabbedPanels.showPanel(0);
$(".submitMaster").attr("style","display:none;");
$(tabbedPanels .getTabs()[1]).attr("disabled","disabled");//IE
//});
}
如果在选项卡中的页面想访问iframe中的元素，可以参考下面代码：
/*JSP中iframe代码片段：
<iframe src="demo.action?detail=&conditionParams.id=${sessionScope.IdForIframe }" id="RefIframeId" name="RefIframeId" width="103%" marginwidth="0" marginheight="0" height="950px" frameborder="0" scrolling="yes"></iframe>
*/
var verificationResultTabbedPanels = new Spry.Widget.TabbedPanels("verificationResultTabbedPanels");
$(function(){
$(verificationResultTabbedPanels.getTabs()[1]).bind("click",function(){
var $iframeObj = $(window.frames["RefIframeId"].document);
var clearItems = ["#menu","#welcome","#title",".buttonBarDiv",".midBtnDiv","#useCancel"];
$.each(clearItems,function(index,data){
$iframeObj.find(data).html("");
});
});
})
</script>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
