JavaScript:ListView示例

JavaScript:ListView示例

代码如下：
<title>列表</title> <style>  </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 = '" + (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>
[Ctrl+A 全选提示:你可先修改部分代码,再点运行代码]

青苹果Web应用商店 https://webapp.taobao.com/

PHP/ASP.NET/ASP/UCHOME/DISCUZ! X系列网站开发，详细需求联系QQ:8511978
相关阅读:
CMake 从文件路径中提取文件名
 std::multimap 按照key遍历---
Windows / Linux 一件编译zlib库
 C++ 11 可变模板参数的两种展开方式
 cmake 生成VS项目文件夹
 C++ 利用文件流复制文件
 利用 getsockname 和 getpeername 来获取某一个链接的本地地址和远端地址
 Windows 用VS编译libevent源码
 揭示同步块索引（上）：从lock开始
 C手写一个多线程，供java调用
原文地址：https://www.cnblogs.com/Dicky/p/126013.html