<head>
<title>网页的名称</title>
<style type="text/css"> /*写css控制样式*/
p{ /*字体为黑体,颜色为红色,大小为30*/
font-family:黑体
color:red
font-size:30px
}
</style>
</head>
<body>
<p>杭州</p>
</body>
</html>
要用到数据库和js。
<html><head>
<title>通用二级下拉菜单(改进版) - 51windows.Net</title>
<meta http-equiv="Content-Type" content="text/html charset=gb2312">
<meta name="author" content="haiwa">
</head>
<body>
<script language="JavaScript">
<!--
function TwoSelectInit(so,dv1,dv2){
var o1=so.o1var o2=so.o2var allstr=so.strvar dt1=so.dt1var dt2=so.dt2var selectonce=so.selectonce
var _s = "*|^@"
var s1=new Array(),v1=new Array(),s2=new Array(),v2=new Array()
var s1i = 0,s2i = 0
if(dt1!=""){
if(!selectonce){allstr=dt1+_s.charAt(1)+_s.charAt(0)+allstr}
else{allstr=dt1+_s.charAt(1)+dt2+_s.charAt(0)+allstr}
}
aa=allstr.split(_s.charAt(0))
for(aai=0aai<aa.lengthaai++){
aaa=aa[aai].split(_s.charAt(1))
tmps1 = aaa[0].split(_s.charAt(3))
s1[aai] = tmps1[0]v1[aai] = (tmps1.length==2)?tmps1[1]:tmps1[0]
s2[aai] = new Array()v2[aai] = new Array()
if(v1[aai]==dv1){s1i = aai}
bbbb=aaa[1]
if(dt2!=""&&!selectonce){if(bbbb==""){bbbb=dt2}else{bbbb=dt2+_s.charAt(2)+bbbb}}
bb=bbbb.split(_s.charAt(2))
for(bbi=0bbi< bb.lengthbbi++){
tmps2 = bb[bbi].split(_s.charAt(3))
s2[aai][bbi] = tmps2[0]v2[aai][bbi] = (tmps2.length==2)?tmps2[1]:tmps2[0]
if(v2[aai][bbi]==dv2){s2i = bbi}
}
}
for(var i=0i<o1.options.lengthi++){o1.remove(i)i--}
for(k=0k<s1.lengthk++){o1.options.add(new Option(s1[k],v1[k]))}
o1.selectedIndex=s1i
for(var i=0i<o2.options.lengthi++){o2.remove(i)i--}
for(k=0k<s2[s1i].lengthk++){o2.options.add(new Option(s2[s1i][k],v2[s1i][k]))}
o2.selectedIndex=s2i
}
function HwTwoSelect(o1,o2,liststr,dt1,dt2,t){this.o1=o1this.o2=o2this.str=liststrthis.dt1=dt1this.dt2=dt2this.selectonce=t}
//-->
</SCRIPT>
<form method="post" name=myform>
选择一次:<select name="a" onchange="TwoSelectInit(test1,this.value)"></select> <select name="b"></select><hr>
选择两次:<select name="aa" onchange="TwoSelectInit(test2,this.value)"></select> <select name="bb"></select><hr>
有初始值:<select name="aaa" onchange="TwoSelectInit(test3,this.value)"></select> <select name="bbb"></select>
</form>
<SCRIPT LANGUAGE="JavaScript">
<!--
var selecttext=""
+"搜索@search|Google@http://www.google.com/^Yahoo@http://www.yahoo.com/"
+"*收藏@fav|无忧视窗@http://www.51windows.Net/^蓝色理想@http://www.blueidea.com/^POPO@http://plod.popoever.net/"
+""
var test1 = new HwTwoSelect(document.myform.a,document.myform.b,selecttext,"-
分类-@","-网址-@",1)//最后的参数表示,选了一级菜单后,二级菜单是否还要显示“请选择”,1或true代码,不显示,0或false代
表显示
TwoSelectInit(test1)
var test2 = new HwTwoSelect(document.myform.aa,document.myform.bb,selecttext,"-分类-@","-网址-@",0)
TwoSelectInit(test2)
var test3 = new HwTwoSelect(document.myform.aaa,document.myform.bbb,selecttext,"-分类-@","-网址-@",0)
TwoSelectInit(test3,"fav","http://www.51windows.Net/")
//-->
</SCRIPT>
<p>以下是示例代码,详细请查看源文件:<hr>
<p>&ltform method="post" name=<font color="#FF00FF">myform</font>&gt<br>
&ltselect name=&quot<font color="#FF0000">select1</font>&quot onchange=&quotTwoSelectInit(<font color="#0000FF">ttt</font>,this.value)&quot&gt&lt/select> &ltselect
name=&quot<font color="#FF0000">select2</font>&quot&gt&lt/select>&lthr><br>
&lt/form></p>
<p>&ltSCRIPT LANGUAGE="JavaScript"><br>
&lt!--<br>
var <font color="#008000">selecttext</font>=&quot&quot<br>
+"搜索@search|Google@http://www.google.com/^Yahoo@http://www.yahoo.com/"<br>
+"*收藏@fav|无忧视窗@http://www.51windows.Net/^蓝色理想@http://www.blueidea.com/^POPO@http://plod.popoever.net/"<br>
+""<br>
<br>
var <font color="#0000FF">ttt</font> = new HwTwoSelect(document.<font color="#FF00FF">myform</font>.<font color="#FF0000">select1</font>,document.<font color="#FF00FF">myform</font>.<font color="#FF0000">select2</font>,<font color="#008000">selecttext</font>,&quot-分类-@","-网址-@",1)<br>
TwoSelectInit(<font color="#0000FF">ttt</font> ,&quotfav&quot,&quothttp://www.51windows.Net/&quot)<br>
<br>
//--><br>
&lt/SCRIPT></p>
<p><font color="#FF0000">bug:在二级菜单有初始值时,如果表单重置,二级菜单的值会变为空</font></p>
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)