一个类似Listview的效果

发表于:2007-06-30来源:作者:点击数: 标签:
title列表/title style !-- body { font-size: 10px } table { font-size: 12px } -- /style script language = @# java script@# function InitList(theList, theTable, iEnd, iId, checkIt) { var colWidth = (document.body.clientWidth - 200) / iEnd wit
<title>列表</title>
<style>
<!--
body { font-size: 10px }
table { font-size: 12px }
-->
</style>
<script language = @#javascript@#>
function InitList(theList, theTable, iEnd, iId, checkIt)
{
var colWidth = (document.body.clientWidth - 200) / iEnd

with(theList)
{
View = 3
BorderStyle = 0
GridLines = true
Checkboxes = checkIt
FullRowSelect = true
LabelEdit = 1

for(var i = 0; i < iEnd; i ++)
{
ColumnHeaders.Add(i + 1, @#Col@# + i, theTable.rows[0].cells[i].innerText, colWidth) //, 100, myAlign)
}
for(var i = 1; i < theTable.rows.length; i ++)
{
myList.ListItems.Add( i, @#Key@# + theTable.rows[i].cells[iId -1].innerText.replace(" ", ""), theTable.rows[i].cells[0].innerText.replace(" ", ""))
for(var j = 1; j < iEnd; j ++)
{
ListItems(i).SubItems(j) = theTable.rows[i].cells[j].innerText.replace(" ", "")
}
}
Sorted = true
}
}
</script>
<script language = @#javascript@# for = @#myList@# event = @#ColumnClick(ColumnHeader)@#>

if(ColumnHeader.SubItemIndex == myList.SortKey)
{
if(myList.SortOrder == 0) myList.SortOrder = 1
else myList.SortOrder = 0
}
else
{
myList.SortKey = ColumnHeader.SubItemIndex
if(myList.SortOrder == 0) myList.SortOrder = 1
else myList.SortOrder == 0
}
</script>
<script language = @#javascript@# for = @#myList@# event = @#ItemClick(Item)@#>
var theValue = ""

theValue = Item.Text + Item.Key
for(i = 1; i <= Item.ListSubItems.Count; i ++) theValue = theValue + "\n" + Item.ListSubItems(i).Text
myValue.value = theValue
</script>
<body onload = @#InitList(myList, myTale, 4, 5, false)@# scroll = @#no@# bgcolor = @#buttonface@# topmargin=@#0@# leftmargin=@#0@#>
<table border=@#0@# cellpadding=@#0@# cellspacing=@#0@# style=@#border-collapse: collapse@# width=@#100%@# height=@#100%@#>
<tr>
<td nowrap>
<script language = @#javascript@#>
document.write( "<object classid=@#clsid:BDD1F04B-858B-11D1-B16A-00C0F0283628@# style = @#width:" + (document.body.clientWidth - 150) + ";height:" + document.body.clientHeight + "@# id=@#myList@#></object> ")
</script>

<table border = @#1@# id = @#myTale@# style = @#display:none@#>
<tr id = @#tablehead@#>
<td id = @#mytd@#>
编号
</td>
<td id = @#mytd@#>
名称
</td>
<td id = @#mytd@#>
价格
</td>
<td id = @#mytd@#>
备注
</td>
<td id = @#mytd@#>
编号
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
101
</td>
<td id = @#mytd@#>
53度特酿
</td>
<td id = @#mytd@#>
186
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
16
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
102
</td>
<td id = @#mytd@#>
52趵突泉特酿
</td>
<td id = @#mytd@#>
128
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
17
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
103
</td>
<td id = @#mytd@#>
39度精品趵突泉特酿
</td>
<td id = @#mytd@#>
60
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
18
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
104
</td>
<td id = @#mytd@#>
34度趵突泉特酿
</td>
<td id = @#mytd@#>
45.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
19
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
105
</td>
<td id = @#mytd@#>
36度趵突泉特酿
</td>
<td id = @#mytd@#>
25.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
20
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
106
</td>
<td id = @#mytd@#>
38度趵突泉特酿
</td>
<td id = @#mytd@#>
15.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
21
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
107
</td>
<td id = @#mytd@#>
39度趵突泉特酿
</td>
<td id = @#mytd@#>
10.58
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
22
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
108
</td>
<td id = @#mytd@#>
39度五年趵突泉陈酿
</td>
<td id = @#mytd@#>
19.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
23
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
109
</td>
<td id = @#mytd@#>
39度八年趵突泉陈酿
</td>
<td id = @#mytd@#>
29.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
24
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
110
</td>
<td id = @#mytd@#>
58度珍品趵突泉特酿
</td>
<td id = @#mytd@#>
288
</td>
<td id = @#mytd@#>
1*4
</td>
<td id = @#mytd@#>
25
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
111
</td>
<td id = @#mytd@#>
52度250ml趵突泉特酿
</td>
<td id = @#mytd@#>
64
</td>
<td id = @#mytd@#>
1*8
</td>
<td id = @#mytd@#>
26
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
123
</td>
<td id = @#mytd@#>
38度趵突泉特酿(金)
</td>
<td id = @#mytd@#>
78
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
27
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
124
</td>
<td id = @#mytd@#>
38度趵突泉特酿(银)
</td>
<td id = @#mytd@#>
58
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
28
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
114
</td>
<td id = @#mytd@#>
32度趵突泉特酿
</td>
<td id = @#mytd@#>
48
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
29
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
120
</td>
<td id = @#mytd@#>
39度锦绣川特酿(瓷)
</td>
<td id = @#mytd@#>
19.8
</td>
<td id = @#mytd@#>
1*12
</td>
<td id = @#mytd@#>
30
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
121
</td>
<td id = @#mytd@#>
36度趵突泉特酿(瓷瓶)
</td>
<td id = @#mytd@#>
48
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
31
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
122
</td>
<td id = @#mytd@#>
34度趵突泉特酿(瓷瓶)
</td>
<td id = @#mytd@#>
88
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
32
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
207
</td>
<td id = @#mytd@#>
48度趵突泉特曲
</td>
<td id = @#mytd@#>
5
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
33
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
210
</td>
<td id = @#mytd@#>
44度趵突泉特曲
</td>
<td id = @#mytd@#>
3.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
34
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
211
</td>
<td id = @#mytd@#>
44度新趵突泉特曲
</td>
<td id = @#mytd@#>
4.2
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
35
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
214
</td>
<td id = @#mytd@#>
44度趵突泉白酒
</td>
<td id = @#mytd@#>
1.5
</td>
<td id = @#mytd@#>
1*10
</td>
<td id = @#mytd@#>
36
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
216
</td>
<td id = @#mytd@#>
44度趵突泉二曲
</td>
<td id = @#mytd@#>
1.4
</td>
<td id = @#mytd@#>
1*10
</td>
<td id = @#mytd@#>
37
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
218
</td>
<td id = @#mytd@#>
39度万竹园特酿
</td>
<td id = @#mytd@#>
5
</td>
<td id = @#mytd@#>
1*20
</td>
<td id = @#mytd@#>
38
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
218
</td>
<td id = @#mytd@#>
39度万竹园特酿
</td>
<td id = @#mytd@#>
5
</td>
<td id = @#mytd@#>
1*12
</td>
<td id = @#mytd@#>
40
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
219
</td>
<td id = @#mytd@#>
46度趵突泉桶装酒
</td>
<td id = @#mytd@#>
15.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
41
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
220
</td>
<td id = @#mytd@#>
54度锦绣川桶装酒
</td>
<td id = @#mytd@#>
16
</td>
<td id = @#mytd@#>
1*4
</td>
<td id = @#mytd@#>
42
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
232
</td>
<td id = @#mytd@#>
50趵突泉大曲
</td>
<td id = @#mytd@#>
2.5
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
43
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
235
</td>
<td id = @#mytd@#>
50趵突泉老窖
</td>
<td id = @#mytd@#>
4
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
44
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
236
</td>
<td id = @#mytd@#>
42度趵突泉陈酿
</td>
<td id = @#mytd@#>
4.5
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
45
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
245
</td>
<td id = @#mytd@#>
42度趵突泉酒
</td>
<td id = @#mytd@#>
4
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
46
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
333
</td>
<td id = @#mytd@#>
42度趵突泉佳酿
</td>
<td id = @#mytd@#>
5.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
47
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
336
</td>
<td id = @#mytd@#>
38度趵突泉特酿
</td>
<td id = @#mytd@#>
8.1
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
48
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
339
</td>
<td id = @#mytd@#>
38度趵突泉特酿
</td>
<td id = @#mytd@#>
8.3
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
49
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
125
</td>
<td id = @#mytd@#>
38度礼品特酿(2瓶装)
</td>
<td id = @#mytd@#>
158
</td>
<td id = @#mytd@#>
1*2*4
</td>
<td id = @#mytd@#>
50
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
238
</td>
<td id = @#mytd@#>
40度趵突泉酒
</td>
<td id = @#mytd@#>
3.6
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
51
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
262
</td>
<td id = @#mytd@#>
46度趵突泉特酿
</td>
<td id = @#mytd@#>
9
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
52
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
263
</td>
<td id = @#mytd@#>
46度趵突泉特酿
</td>
<td id = @#mytd@#>
9
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
53
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
242
</td>
<td id = @#mytd@#>
44度趵突泉老窖
</td>
<td id = @#mytd@#>
1.8
</td>
<td id = @#mytd@#>
1*10
</td>
<td id = @#mytd@#>
54
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
117
</td>
<td id = @#mytd@#>
38度礼品特酿
</td>
<td id = @#mytd@#>
88
</td>
<td id = @#mytd@#>
1*4
</td>
<td id = @#mytd@#>
55
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
244
</td>
<td id = @#mytd@#>
42度趵突泉酒
</td>
<td id = @#mytd@#>
4
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
56
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
247
</td>
<td id = @#mytd@#>
40度趵突泉酒
</td>
<td id = @#mytd@#>
6
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
57
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
126
</td>
<td id = @#mytd@#>
54度礼品特酿(2瓶装)
</td>
<td id = @#mytd@#>
488
</td>
<td id = @#mytd@#>
1*2*4
</td>
<td id = @#mytd@#>
58
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
249
</td>
<td id = @#mytd@#>
44度趵突泉特曲
</td>
<td id = @#mytd@#>
4.53
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
59
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
264
</td>
<td id = @#mytd@#>
54度锦绣川佳酿
</td>
<td id = @#mytd@#>
3.8
</td>
<td id = @#mytd@#>
1*8
</td>
<td id = @#mytd@#>
60
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
265
</td>
<td id = @#mytd@#>
44度锦绣川白酒
</td>
<td id = @#mytd@#>
8
</td>
<td id = @#mytd@#>
1*4
</td>
<td id = @#mytd@#>
61
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
252
</td>
<td id = @#mytd@#>
44度卧虎山白酒
</td>
<td id = @#mytd@#>
2.6
</td>
<td id = @#mytd@#>
1*12
</td>
<td id = @#mytd@#>
62
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
253
</td>
<td id = @#mytd@#>
38度趵突泉特酿(实惠型)
</td>
<td id = @#mytd@#>
3.6
</td>
<td id = @#mytd@#>
1*8
</td>
<td id = @#mytd@#>
63
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
253
</td>
<td id = @#mytd@#>
38度趵突泉特酿(实惠型)
</td>
<td id = @#mytd@#>
3.6
</td>
<td id = @#mytd@#>
1*12
</td>
<td id = @#mytd@#>
64
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
254
</td>
<td id = @#mytd@#>
38度125ml趵突泉特酿
</td>
<td id = @#mytd@#>
2
</td>
<td id = @#mytd@#>
1*24
</td>
<td id = @#mytd@#>
65
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
255
</td>
<td id = @#mytd@#>
38度趵突泉酒
</td>
<td id = @#mytd@#>
6.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
66
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
256
</td>
<td id = @#mytd@#>
35度趵突泉特曲
</td>
<td id = @#mytd@#>
5.6
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
67
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
258
</td>
<td id = @#mytd@#>
46度趵突泉酒
</td>
<td id = @#mytd@#>
4.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
68
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
259
</td>
<td id = @#mytd@#>
44度趵突泉特曲
</td>
<td id = @#mytd@#>
3.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
69
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
260
</td>
<td id = @#mytd@#>
42度趵突泉特曲(简装)
</td>
<td id = @#mytd@#>
3.18
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
70
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
261
</td>
<td id = @#mytd@#>
50度趵突泉特曲(捆扎)
</td>
<td id = @#mytd@#>
2
</td>
<td id = @#mytd@#>
1*10
</td>
<td id = @#mytd@#>
71
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
315
</td>
<td id = @#mytd@#>
38度趵突泉特酿(招财进宝)
</td>
<td id = @#mytd@#>
6.5
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
72
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
318
</td>
<td id = @#mytd@#>
42度趵突泉醇香
</td>
<td id = @#mytd@#>
3.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
73
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
321
</td>
<td id = @#mytd@#>
42度趵突泉特曲
</td>
<td id = @#mytd@#>
3.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
74
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
323
</td>
<td id = @#mytd@#>
38度趵突泉特酿
</td>
<td id = @#mytd@#>
8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
75
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
326
</td>
<td id = @#mytd@#>
39度趵突泉特酿(一级)
</td>
<td id = @#mytd@#>
3.5
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
76
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
329
</td>
<td id = @#mytd@#>
44度趵突泉特酿
</td>
<td id = @#mytd@#>
5.4
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
77
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
331
</td>
<td id = @#mytd@#>
44度趵突泉特酿
</td>
<td id = @#mytd@#>
5.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
78
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
332
</td>
<td id = @#mytd@#>
44度趵突泉酒
</td>
<td id = @#mytd@#>
5.5
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
79
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
339
</td>
<td id = @#mytd@#>
38度趵突泉特酿
</td>
<td id = @#mytd@#>
8.3
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
80
</td>
</tr>
<tr id = @#mytr@#>
<td id = @#mytd@#>
259
</td>
<td id = @#mytd@#>
44度趵突泉特曲
</td>
<td id = @#mytd@#>
3.8
</td>
<td id = @#mytd@#>
1*6
</td>
<td id = @#mytd@#>
83
</td>
</tr>
</table>
</td>
<td nowrap width=@#150@# align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="100%" id="AutoNumber1">
<tr>
<td> </td>
</tr>
<tr>
<td>?内容:</td>
</tr>
<tr>
<td>
?
<textarea rows="10" name="myValue" cols = @#16@#></textarea>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
<script language = "javascript">
//function chageSize()
//{
//myList.width = document.body.clientWidth - 150
//myList.height = document.body.clientHeight
//alert(document.body.clientWidth - 150)
//setTimeout("chageSize()", 10)
//}
//chageSize()
</script>

原文转自:http://www.ltesting.net