关于div的定位显示问题
代码如下：
1
2
3
4
5<html>
6 <head>
7 <title>NetShop Management Category Add Panel
8 </title>
9 <meta http-equiv=Expires content=0>
10<meta http-equiv=Pragma content=no-cache>
11<meta http-equiv=Cache-Control content=no-cache>
12 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
13 <link type="text/css" rel="stylesheet" href="css/xtree2.css">
14 <script type="text/javascript" src="js/xtree2.js"></script>
15 <!-- xloadtree2.js文件依赖xtree2.js文件 -->
16 <script type="text/javascript" src="js/xloadtree2.js"></script>
17
<script>
18
function showTree(a)
19
{
20 document.getElementById('divTree').style.display = "block";
21 document.getElementById('divTree').style.left=a.offsetLeft+'px'
22 document.getElementById('divTree').style.top=a.offsetTop+ a.offsetHeight+'px'
23
}
24function hideTree(a)
25{
26 document.getElementById('divTree').style.display="none";
27}
28function insertValue(oNode)
29{
30 document.getElementById('parentCategoryName').value = oNode.text;
31 document.getElementById('parentCategoryId').value = oNode.id;
32 document.getElementById('divTree').style.display = "none";
33 //alert(oNode.id);
34}
35
</script>
36 </head>
37 <body>
38 <form name="categoryForm" method="post" action="/NetShop/manage/categoryAdd.do">
39 <br />
40 <br />
41 <table border="1" cellpadding="4" cellspacing="0" width="600"
42 align="center">
43 <tr>
44 <td></td>
45 <td></td>
46 <td></td>
47 </tr>
48 <tr>
49 <td>
50 Select Parent Category Name:
51 </td>
52 <td>
53 <input type="text" name="parentCategoryName" value="" onfocus="showTree(this);">
54 </td>
55 <td>
56
57 </td>
58 </tr>
59 <tr>
60 <td>
61 Category Name:
62 </td>
63 <td>
64 <input type="text" name="categoryName" value="">
65 </td>
66 <td>
67
68 </td>
69 </tr>
70 <tr>
71 <td>
72 Description:
73 </td>
74 <td>
75 <textarea name="categoryDescription"></textarea>
76 </td>
77 <td>
78
79 </td>
80 </tr>
81 <tr>
82 <td>
83 Status:
84 </td>
85 <td>
86 <select name="categoryStatus" size="1"><option value="NORMAL">Normal</option>
87 <option value="LOCKED">Locked</option>
88 <option value="DELETED">Deleted</option></select>
89
90 </td>
91 <td>
92
93 </td>
94 </tr>
95 </table>
96 <input type="hidden" name="parentCategoryId" value="">
97
98 <br />
99
100 <br />
101 <br />
102 <input type="submit" value="Submit">
103 <input type="submit" name="org.apache.struts.taglib.html.CANCEL" value="Reset" onclick="bCancel=true;">
104 </form>
105 <div id="divTree"
106 style="overflow-y:auto;height:200px;width:70px;display:none;position:relative;background-color:#FFF;z-index:1000;border-style:solid;border-color:#ACAA9C;border-width:1px">
107 <script type="text/javascript">
108var tree=new WebFXLoadTree("dictionaries","dictionaries.xml");
109var ti0 = new WebFXTreeItem("Item 0");
110tree.add(ti0);
111tree.write();
112tree.expand();
113</script>
114 </div>
115 </body>
116</html>
117
118
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
改了后：
1
2
3
4
5<html>
6 <head>
7 <title>NetShop Management Category Add Panel
8 </title>
9 <meta http-equiv=Expires content=0>
10<meta http-equiv=Pragma content=no-cache>
11<meta http-equiv=Cache-Control content=no-cache>
12 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
13 <link type="text/css" rel="stylesheet" href="css/xtree2.css">
14 <script type="text/javascript" src="js/xtree2.js"></script>
15 <!-- xloadtree2.js文件依赖xtree2.js文件 -->
16 <script type="text/javascript" src="js/xloadtree2.js"></script>
17 <script>
18 function showTree(a)
19{
20 document.getElementById('divTree').style.display ="";
21 document.getElementById('divTree').style.left=a.offsetLeft+'px'
22 document.getElementById('divTree').style.top=a.offsetTop+ a.offsetHeight+'px'
23}
24function hideTree(a)
25{
26 document.getElementById('divTree').style.display="none";
27}
28function insertValue(oNode)
29{
30 document.getElementById('parentCategoryName').value = oNode.text;
31 document.getElementById('parentCategoryId').value = oNode.id;
32 document.getElementById('divTree').style.display = "none";
33 //alert(oNode.id);
34}
35 </script>
36 </head>
37 <body>
38 <form name="categoryForm" method="post" action="/NetShop/manage/categoryAdd.do">
39 <br />
40 <br />
41 <table border="1" cellpadding="4" cellspacing="0" width="600"
42 align="center">
43 <tr>
44 <td></td>
45 <td></td>
46 <td></td>
47 </tr>
48 <tr>
49 <td>
50 Select Parent Category Name:
51 </td>
52 <td>
53 <input type="text" id="parentCategoryName" name="parentCategoryName" value="" onfocus="showTree(this);">
54 <div id="divTree"
55 style="overflow-y:auto;height:200px;width:70px;display:none;position:relative;background-color:#FFF;z-index:1000;border-style:solid;border-color:#ACAA9C;border-width:1px">
56 <script type="text/javascript">
57var tree=new WebFXLoadTree("dictionaries","dictionaries.xml");
58//var tree=new WebFXTree("dictionaries");
59tree.setBehavior('explorer');
60
61//var category12=new WebFXLoadTreeItem("皮包","category.xml");
62//tree.add(dictionaries);
63var ti0 = new WebFXTreeItem("Item 0");
64tree.add(ti0);
65tree.write();
66tree.expand();
67</script>
68 </div></td>
69 <td>
70
71 </td>
72 </tr>
73 <tr>
74 <td>
75 Category Name:
76 </td>
77 <td>
78 <input type="text" name="categoryName" value="">
79 </td>
80 <td>
81
82 </td>
83 </tr>
84 <tr>
85 <td>
86 Description:
87 </td>
88 <td>
89 <textarea name="categoryDescription"></textarea>
90 </td>
91 <td>
92
93 </td>
94 </tr>
95 <tr>
96 <td>
97 Status:
98 </td>
99 <td>
100 <select name="categoryStatus" size="1"><option value="NORMAL">Normal</option>
101 <option value="LOCKED">Locked</option>
102 <option value="DELETED">Deleted</option></select>
103
104 </td>
105 <td>
106
107 </td>
108 </tr>
109 </table>
110 <input type="hidden" name="parentCategoryId" value="">
111
112 <br />
113
114 <br />
115 <br />
116 <input type="submit" value="Submit">
117 <input type="submit" name="org.apache.struts.taglib.html.CANCEL" value="Reset" onclick="bCancel=true;">
118 </form>
119
120 </body>
121</html>
122
123
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
转载于:https://www.cnblogs.com/lexus/archive/2007/05/16/748797.html