关于div的定位显示问题

关于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        
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;70px;display:none;position:relative;background-color:#FFF;z-index:1000;border-style:solid;border-color:#ACAA9C;border-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

改了后：

  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        
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;70px;display:none;position:relative;background-color:#FFF;z-index:1000;border-style:solid;border-color:#ACAA9C;border-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
相关阅读:
js_闭包
 js_函数参数的相关问题
 js_浏览器控制台打印引用数据是打印的原始数据
 js_递归函数在严格模式下的调用方法
 js_执行环境及作用域
 js_关于为什么'函数的参数都是按值传递'的理解
 （项目）爬取安居客二手房房屋信息
 （项目）爬取自如租房链接的价格
 识别验证码之百度通用识别接口
 （项目）使用selenium的截屏功能实现自动登陆滴滴打码网
原文地址：https://www.cnblogs.com/lexus/p/748797.html