标签：php javascript iframe html
本文主要是记录自己寒假作业PHP网站实现加载界面的文章，运行效果如下图所示。主要记录php+html+Apache开发网站的3个功能：(方便以后阅读和其他人学习)
<?php
include("head.php");
?>
<br />
<!-- 布局中部 -->
<div id="middle">
<!-- 布局中部右边 否则总是显示在左边之下 why? -->
<div id="index_right">
<iframe height="100%" width="100%" border="0" frameborder="0"
src="main_right.php" name="rightFrame" id="rightFrame" title="rightFrame">
</iframe>
</div>
<!-- 布局中部左边 -->
<div id="index_left">
<?php
include('main_left.php');
?>
</div>
</div> 主要是通过head.php布局该界面的头部，main_right.php实现加载界面的中间右边部分，main_left.php加载界面的中间左边菜单栏，而<iframe>后面实现局部加载会讲述。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>《分布式系统》精品课程学习</title>
<link href="css/mycss.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<div id="main">
<TABLE cellSpacing=0 cellPadding=0 width="100%"
background="images/header_bg.gif" border=0>
<!--头部图片-->
<TR height=80>
<TD width=260>
<IMG height=80 src="images/logo.gif" width=260>
</TD>
<TD style="FONT-SIZE: 12px; FONT-WEIGHT: bold; COLOR: #000;
PADDING-TOP: 20px; PADDING-RIGHT: 20px" align=right>
您还未登录! |
<A style="COLOR: #000" href=""
target=main>登录</A>|
<A style="COLOR: #000" href=""
target=main>注册</A>|
<A style="COLOR: #000" href=""
onclick="if (confirm('确定要退出吗？')) return true; else return false;"
target=main>退出系统</A>
</TD>
</TABLE>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TR bgColor=#1c5db6 height=4>
<TD></TD></TR>
</TABLE><SCRIPT language=javascript>
function expand(el)
{
childObj = document.getElementById("child" + el);
if (childObj.style.display == 'none')
{
childObj.style.display = 'block';
}
else
{
childObj.style.display = 'none';
}
return;
}
</SCRIPT>
其中第一个菜单调用代码如下，通过onclick=expend(1)调用，而且子菜单DISPLAY初值为NONE，则调用该函数后初值为block显示。<!-- 第一选项 -->
<TABLE cellSpacing=0 cellPadding=0 width=150 border=0>
<TR height=30>
<TD style="PADDING-LEFT: 20px; FONT-SIZE: 15px" background=images/menu_bt.jpg><A
class=menuParent onclick=expand(1)
href="javascript:void(0);">课程首页</A></TD></TR>
<TR height=4>
<TD></TD></TR>
</TABLE>
<TABLE id=child1 style="DISPLAY: none" cellSpacing=0 cellPadding=0
width=150 border=0>
<TR height=20>
<TD align=middle width=30><IMG height=9
src="images/menu_icon.gif" width=9></TD>
<TD><A href="main_right_yk1.php"
target="rightFrame">首页介绍</A></TD></TR>
<TR height=4>
<TD colSpan=2></TD></TR>
</TABLE>
<!-- 第二选项 --><!-- 布局中部右边 --> <div id="index_right"> <iframe height="100%" width="100%" border="0" frameborder="0" src="main_right.php" name="rightFrame" id="rightFrame" title="rightFrame"> </iframe> </div>上面代码中其中src=""中加入要嵌入的页面，name=""要嵌入页面中traget。
<TABLE id=child2 style="DISPLAY: none" cellSpacing=0 cellPadding=0
width=150 border=0>
<TR height=20>
<TD align=middle width=30><IMG height=9
src="images/menu_icon.gif" width=9></TD>
<TD><A href="main_right_yk2-1.php" class=menuChild
target="rightFrame">课程简介</A></TD></TR>
<TR height=20>
<TD align=middle width=30><IMG height=9
src="images/menu_icon.gif" width=9></TD>
<TD><A href="main_right_yk2-2.php"
target="rightFrame">教师团队</A></TD></TR>
<TR height=20>
<TD align=middle width=30><IMG height=9
src="images/menu_icon.gif" width=9></TD>
<TD><A href="main_right_yk2-3.php"
target="rightFrame">教学条件</A></TD></TR>
<TR height=4>
<TD colSpan=2></TD></TR>
</TABLE> 最后讲讲接下来需要解决的问题：PHP网站使用JavaScript和Iframe简单实现部分刷新效果
标签：php javascript iframe html
原文地址：http://blog.csdn.net/eastmount/article/details/43848585
