JQuery实现的二级餐单

 

1 <% @ Page Language = " C# " AutoEventWireup = " true " CodeBehind = " JQuery.aspx.cs " Inherits = " Jquery_EX.JQuery " %>
2
3   <! DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
4   < html xmlns = " http://www.w3.org/1999/xhtml " >
5 < head runat = " server " >
6 < title > JQuery菜单 </ title >
7 < script src = " Scripts/jquery-1.4.1-vsdoc.js " type = " text/javascript " ></ script >
8 < script src = " Scripts/jquery-1.4.1.js " type = " text/javascript " ></ script >
9 < script type = " text/javascript " >
10 // $(function () {
11 // $("#1").hide();
12 // $("#2").hide();
13 // $("#jl").click(ShowJl);
14 // $("#ms").click(ShowMs);
15
16 // $("#cgk").click(CheckUrl);
17 // });
18 // function ShowJl() {
19 // $("#1").show();
20 // $("#2").hide();
21 // }
22 // function ShowMs() {
23 // $("#1").hide();
24 // $("#2").show();
25 // }
26 // function CheckUrl() {
27 // $("#Im").attr("src", " http://www.baidu.com/ ");
28 // }
29
30 $(function () {
31 hide();
32 spanclick();
33 uiclick()
34 });
35 // 隐藏ul下的所有标签
36 function hide() {
37 $( " ul " ).each(function (i) {
38 $( this ).hide();
39 })
40 }
41
42 function spanclick() {
43 $( " span " ).each(function (i) {
44 $( this ).click(function () {
45 hide();
46 $( this ).parent().find( " ul " ).show();
47 })
48 })
49 }
50
51 function uiclick() {
52 $( " li " ).each(function (i) {
53 $( this ).find( " a " ).attr( " title " );
54 $( this ).click(function () {
55 $( " #Im " ).attr( " src " , $( this ).find( " a " ).attr( " title " ));
56 })
57
58 })
59 }
60 </ script >
61 </ head >
62 < body >
63 < form id = " form1 " runat = " server " >
64 < div >
65 < div style = " float: left; width: 20% " >
66 < div >
67 < span id = " jl " > 简历管理 </ span >
68 < ul id = " 1 " >
69 < li id = " cgk " >< a href = " # " title = " http://www.hao123.com " > 稿库库 </ a ></ li >
70 < li id = " jlk " >< a href = " # " title = " http://www.baidu.com " > 简历库 </ a ></ li >
71 </ ul >
72 </ div >
73 < div >
74 < span id = " ms " > 面试管理 </ span >
75 < ul id = " 2 " >
76 < li >< a href = " # " title = " http://www.sogou.com " > 未面库 </ a ></ li >
77 < li >< a href = " # " title = " http://www.baidu.com " > 已面库 </ a ></ li >
78 </ ul >
79 </ div >
80 </ div >
81 < div style = " float:right; width: 80% " >
82 < iframe id = " Im " style = " width: 100%; height: 800px; " src = " http://www.hao123.com " ></ iframe >
83 </ div >
84
85 </ div >
86 </ form >
87 </ body >
88 </ html >
89

 

转载于:https://www.cnblogs.com/gyweiUSTC/articles/1881514.html