基于jQuery的下拉菜单菜单【02】，诸位上眼！！！
前言
接上次的话题，仍然是团队近期将会有大变化，最近确实有点蛋疼，对以后的规划神马的乱成一团，晚上也不想学习神马的了，有时候就什么都不做发现一晚上就莫名其妙的过去了......
但是上班时候不行，没事必须找点事情来做，反正现在做的东西多少有点......，所以闲暇中提炼了**过程中觉得有意义的东西。
上一版本
上周这个东东就基本完成了，反正也是菜鸟水平的东西，献丑什么的也没时间怕了，这次就上次留下的几个问题做了简单处理，形成了今天的东西，若是再优化的话应该是性能上的东西了吧。
① 菜单在窗口最下方拉长窗口问题:
解决后：
② 关于异步数据加载的问题：
比如一个表格数据，每次鼠标移动上去才加载数据，生成菜单；我们知道一旦涉及异步操作往往破坏原有程序逻辑，这块处理上我还没有好的方法。
③ 为类添加方法
最后我发现使用时候不能每次都指定id，很多时候会用class选择器，所以有了以下事情，但是这块仍然是后续优化重点，事实上他还是依赖于id......
1 initNewDrop({ 2 klass: 'show_info', 3 open: '1', 4 close: '1', 5 asyncDataLoad: function (el) { 6 //el为鼠标滑动元素 7 var asyncObj = {}; 8 asyncObj.url = 'Handler.ashx'; 9 asyncObj.param = { 'act_id': el.find('ul').attr('act_id') }; 10 asyncObj.getDropItem = function (data) { 11 //data为异步请求获取后的数据 12 if (data && typeof data == 'string') { 13 data = eval('(' + data + ')'); 14 } 15 data = data.data; 16 var type = data.notice; 17 if (type == 0) { 18 msg = '不发送短信'; 19 } else if (type == 1) { 20 msg = '自动短信'; 21 } else if (type == 3) { 22 msg = '手动短信'; 23 } 24 var param = [ 25 ['活动id：' + data.act_id], 26 ['报名人数：' + data.reg_num], 27 ['短信类型：' + msg], 28 ['<a href="#">自动短信条数：' + data.sms_auto_count + '</a>'], 29 ['<a href="http://www.baidu.com/" target="_blank">手动短信条数：' + data.sms_manual_count] 30 ]; 31 return param; 32 }; 33 return asyncObj; 34 }, 35 func: function (e, scope, listEl, toggleEl) { 36 var el = $(this); 37 scope.closeList(); 38 alert(el.html()); 39 return false; 40 } 41 });
1 function initNewDrop(opts) { 2 if (opts.klass) { 3 $('.' + opts.klass).each(function (k, v) { 4 var el = $(this); 5 var id = new Date().getTime() + '_' + k; 6 if (el.attr('id')) { 7 id = el.attr('id'); 8 } else { 9 el.attr('id', id); 10 } 11 opts.id = id; 12 new DropList(opts); 13 }); 14 } else { 15 new DropList(opts); 16 } 17 }
④ 级联菜单
异步加载
关于异步加载一直是我一个比较头疼的问题，这里大概是这样处理的，先贴上关键代码：
1 前台调用：
View Code
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title></title> 5 <link href="my_drop.css" rel="stylesheet" type="text/css" /> 6 <style type="text/css"> 7 .show_info 8 { 9 width:100px; 10 } 11 12 </style> 13 <script type="text/javascript" src="http://www.cnblogs.com/jquery-1.7.1.min.js"></script> 14 <script src="DropList.js" type="text/javascript"></script> 15 <script type="text/javascript"> 16 17 //方案一 18 $(document).ready(function () { 19 //title_text 20 initNewDrop({ 21 klass: 'show_info', 22 open: '1', 23 close: '1', 24 asyncDataLoad: function (el) { 25 //el为鼠标滑动元素 26 var asyncObj = {}; 27 asyncObj.url = 'Handler.ashx'; 28 asyncObj.param = { 'act_id': el.find('ul').attr('act_id') }; 29 asyncObj.getDropItem = function (data) { 30 //data为异步请求获取后的数据 31 if (data && typeof data == 'string') { 32 data = eval('(' + data + ')'); 33 } 34 data = data.data; 35 var type = data.notice; 36 if (type == 0) { 37 msg = '不发送短信'; 38 } else if (type == 1) { 39 msg = '自动短信'; 40 } else if (type == 3) { 41 msg = '手动短信'; 42 } 43 var param = [ 44 ['活动id：' + data.act_id], 45 ['报名人数：' + data.reg_num], 46 ['短信类型：' + msg], 47 ['<a href="#">自动短信条数：' + data.sms_auto_count + '</a>'], 48 ['<a href="http://www.baidu.com/" target="_blank">手动短信条数：' + data.sms_manual_count] 49 ]; 50 return param; 51 }; 52 return asyncObj; 53 }, 54 func: function (e, scope, listEl, toggleEl) { 55 var el = $(this); 56 scope.closeList(); 57 alert(el.html()); 58 return false; 59 } 60 }); 61 62 63 }); 64 </script> 65 </head> 66 <body> 67 <table> 68 <tr class="thead"> 69 <td width="50px"> 70 id 71 </td> 72 <td> 73 活动名称 74 </td> 75 <td width="70px"> 76 登录 77 </td> 78 <td width="60px"> 79 专题 80 </td> 81 <td width="100px"> 82 开始时间 83 </td> 84 <td width="100px"> 85 结束时间 86 </td> 87 <td width="300px"> 88 快速入口 89 </td> 90 </tr> 91 <tr class=""> 92 <td class=" "> 93 509 94 </td> 95 <td class=" "> 96 test_vote 97 </td> 98 <td> 99 否 100 </td> 101 <td> 102 <a href="http://www.qq.com" title="http://www.qq.com" target="_black">查看</a> 103 </td> 104 <td> 105 <span class="start_time" time="1364784875" title="2013-04-01 10:54:35"></span> 106 </td> 107 <td> 108 <span class="end_time" time="1364871292" title="2013-04-02 10:54:52"></span> 109 </td> 110 <td> 111 <div class="show_info"> 112 <div> 113 <a href="activity/509/user/list" class="p4">用户</a> 114 </div> 115 <ul class="info_detail" isload="no" act_id="509"> 116 </ul> 117 </div> 118 <a href="activity/509/edit/page" class="p4">编辑</a> <a href="activity/509/setting/page" 119 class="p4">设置</a> <a href="activity/509/messlog/page" class="p4">短信日志</a> <a href="activity/509/demo" 120 class="p4" target="_blank">页面</a> 121 </td> 122 </tr> 123 <tr class="alt-row"> 124 <td class=" "> 125 507 126 </td> 127 <td class=" "> 128 荣威团购 129 </td> 130 <td> 131 否 132 </td> 133 <td> 134 <a href="http://cd.qq.com/a/20130401/000355.htm" title="http://cd.qq.com/a/20130401/000355.htm" 135 target="_black">查看</a> 136 </td> 137 <td> 138 <span class="start_time" time="1364780571" title="2013-04-01 09:42:51"></span> 139 </td> 140 <td> 141 <span class="end_time" time="1379780571" title="2013-09-22 00:22:51"></span> 142 </td> 143 <td> 144 <div class="show_info"> 145 <div> 146 <a href="activity/507/user/list" class="p4">用户</a> 147 </div> 148 <ul class="info_detail" isload="no" act_id="507"> 149 </ul> 150 </div> 151 <a href="activity/507/edit/page" class="p4">编辑</a> <a href="activity/507/setting/page" 152 class="p4">设置</a> <a href="activity/507/messlog/page" class="p4">短信日志</a> <a href="activity/507/demo" 153 class="p4" target="_blank">页面</a> 154 </td> 155 </tr> 156 <tr class=""> 157 <td class=" "> 158 506 159 </td> 160 <td class=" "> 161 大成娱乐新版上线满意度调查 162 </td> 163 <td> 164 是(type2) 165 </td> 166 <td> 167 <a href="http://cd.qq.com/zt2013/ent_new/" title="http://cd.qq.com/zt2013/ent_new/" 168 target="_black">查看</a> 169 </td> 170 <td> 171 <span class="start_time" time="1364770800" title="2013-04-01 07:00:00"></span> 172 </td> 173 <td> 174 <span class="end_time" time="1365566400" title="2013-04-10 12:00:00"></span> 175 </td> 176 <td> 177 <div class="show_info"> 178 <div> 179 <a href="activity/506/user/list" class="p4">用户</a> 180 </div> 181 <ul class="info_detail" isload="no" act_id="506"> 182 </ul> 183 </div> 184 <a href="activity/506/edit/page" class="p4">编辑</a> <a href="activity/506/setting/page" 185 class="p4">设置</a> <a href="activity/506/messlog/page" class="p4">短信日志</a> <a href="activity/506/demo" 186 class="p4" target="_blank">页面</a> 187 </td> 188 </tr> 189 <tr class="alt-row"> 190 <td class=" "> 191 502 192 </td> 193 <td class=" "> 194 四川赏花踏青地 195 </td> 196 <td> 197 是(type2) 198 </td> 199 <td> 200 <a href="http://cd.qq.com" title="http://cd.qq.com" target="_black">查看</a> 201 </td> 202 <td> 203 <span class="start_time" time="1364534752" title="2013-03-29 13:25:52"></span> 204 </td> 205 <td> 206 <span class="end_time" time="1366016410" title="2013-04-15 17:00:10"></span> 207 </td> 208 <td> 209 <div class="show_info"> 210 <div> 211 <a href="activity/502/user/list" class="p4">用户</a> 212 </div> 213 <ul class="info_detail" isload="no" act_id="502"> 214 </ul> 215 </div> 216 <a href="activity/502/edit/page" class="p4">编辑</a> <a href="activity/502/setting/page" 217 class="p4">设置</a> <a href="activity/502/messlog/page" class="p4">短信日志</a> <a href="activity/502/demo" 218 class="p4" target="_blank">页面</a> 219 </td> 220 </tr> 221 <tr class=""> 222 <td class=" "> 223 500 224 </td> 225 <td class=" "> 226 安信地板4月13日 227 </td> 228 <td> 229 是(type1) 230 </td> 231 <td> 232 <a href="http://mycd.qq.com/t-817718-1.htm" title="http://mycd.qq.com/t-817718-1.htm" 233 target="_black">查看</a> 234 </td> 235 <td> 236 <span class="start_time" time="1364527690" title="2013-03-29 11:28:10"></span> 237 </td> 238 <td> 239 <span class="end_time" time="1365790090" title="2013-04-13 02:08:10"></span> 240 </td> 241 <td> 242 <div class="show_info"> 243 <div> 244 <a href="activity/500/user/list" class="p4">用户</a> 245 </div> 246 <ul class="info_detail" isload="no" act_id="500"> 247 </ul> 248 </div> 249 <a href="activity/500/edit/page" class="p4">编辑</a> <a href="activity/500/setting/page" 250 class="p4">设置</a> <a href="activity/500/messlog/page" class="p4">短信日志</a> <a href="activity/500/demo" 251 class="p4" target="_blank">页面</a> 252 </td> 253 </tr> 254 <tr class="alt-row"> 255 <td class=" self_msg"> 256 494 257 </td> 258 <td class=" self_msg"> 259 索菲亚大联盟 260 </td> 261 <td> 262 是(type1) 263 </td> 264 <td> 265 <a href="http://mycd.qq.com/t-817167-1.htm" title="http://mycd.qq.com/t-817167-1.htm" 266 target="_black">查看</a> 267 </td> 268 <td> 269 <span class="start_time" time="1364458330" title="2013-03-28 16:12:10"></span> 270 </td> 271 <td> 272 <span class="end_time" time="1365807130" title="2013-04-13 06:52:10"></span> 273 </td> 274 <td> 275 <div class="show_info"> 276 <div> 277 <a href="activity/494/user/list" class="p4">用户</a> 278 </div> 279 <ul class="info_detail" isload="no" act_id="494"> 280 </ul> 281 </div> 282 <a href="activity/494/edit/page" class="p4">编辑</a> <a href="activity/494/setting/page" 283 class="p4">设置</a> <a href="activity/494/messlog/page" class="p4">短信日志</a> <a href="activity/494/demo" 284 class="p4" target="_blank">页面</a> 285 </td> 286 </tr> 287 <tr class=""> 288 <td class=" activity_end "> 289 470 290 </td> 291 <td class=" activity_end "> 292 爱看团《魔境仙踪》周五DMAX3D仅25元！ 293 </td> 294 <td> 295 是(type1) 296 </td> 297 <td> 298 <a href="http://cd.qq.com/zt2013/ikan10/" title="http://cd.qq.com/zt2013/ikan10/" 299 target="_black">查看</a> 300 </td> 301 <td> 302 <span class="start_time" time="1364354987" title="2013-03-27 11:29:47"></span> 303 </td> 304 <td> 305 <span class="end_time" time="1364529600" title="2013-03-29 12:00:00"></span> 306 </td> 307 <td> 308 <div class="show_info"> 309 <div> 310 <a href="activity/470/user/list" class="p4">用户</a> 311 </div> 312 <ul class="info_detail" isload="no" act_id="470"> 313 </ul> 314 </div> 315 <a href="activity/470/edit/page" class="p4">编辑</a> <a href="activity/470/setting/page" 316 class="p4">设置</a> <a href="activity/470/messlog/page" class="p4">短信日志</a> <a href="activity/470/demo" 317 class="p4" target="_blank">页面</a> 318 </td> 319 </tr> 320 <tr class="alt-row"> 321 <td class=" activity_end "> 322 462 323 </td> 324 <td class=" activity_end "> 325 《厨戏痞》见面会仅40元 326 </td> 327 <td> 328 是(type1) 329 </td> 330 <td> 331 <a href="http://cd.qq.com/zt2013/ikan9/" title="http://cd.qq.com/zt2013/ikan9/" target="_black"> 332 查看</a> 333 </td> 334 <td> 335 <span class="start_time" time="1364271051" title="2013-03-26 12:10:51"></span> 336 </td> 337 <td> 338 <span class="end_time" time="1364439651" title="2013-03-28 11:00:51"></span> 339 </td> 340 <td> 341 <div class="show_info"> 342 <div> 343 <a href="activity/462/user/list" class="p4">用户</a> 344 </div> 345 <ul class="info_detail" isload="no" act_id="462"> 346 </ul> 347 </div> 348 <a href="activity/462/edit/page" class="p4">编辑</a> <a href="activity/462/setting/page" 349 class="p4">设置</a> <a href="activity/462/messlog/page" class="p4">短信日志</a> <a href="activity/462/demo" 350 class="p4" target="_blank">页面</a> 351 </td> 352 </tr> 353 <tr class=""> 354 <td class=" self_msg"> 355 449 356 </td> 357 <td class=" self_msg"> 358 醉美四川—Q友申领明信片将春天寄回家 359 </td> 360 <td> 361 是(type1) 362 </td> 363 <td> 364 <a href="http://cd.qq.com/zt2013/CDspring/index.htm" title="http://cd.qq.com/zt2013/CDspring/index.htm" 365 target="_black">查看</a> 366 </td> 367 <td> 368 <span class="start_time" time="1364140800" title="2013-03-25 00:00:00"></span> 369 </td> 370 <td> 371 <span class="end_time" time="1366300800" title="2013-04-19 00:00:00"></span> 372 </td> 373 <td> 374 <div class="show_info"> 375 <div> 376 <a href="activity/449/user/list" class="p4">用户</a> 377 </div> 378 <ul class="info_detail" isload="no" act_id="449"> 379 </ul> 380 </div> 381 <a href="activity/449/edit/page" class="p4">编辑</a> <a href="activity/449/setting/page" 382 class="p4">设置</a> <a href="activity/449/messlog/page" class="p4">短信日志</a> <a href="activity/449/demo" 383 class="p4" target="_blank">页面</a> 384 </td> 385 </tr> 386 <tr class="alt-row"> 387 <td class=" "> 388 446 389 </td> 390 <td class=" "> 391 绵阳家居建材团购报名 392 </td> 393 <td> 394 否 395 </td> 396 <td> 397 <a href="http://cd.qq.com/zt2013/myjjjctg/index.htm" title="http://cd.qq.com/zt2013/myjjjctg/index.htm" 398 target="_black">查看</a> 399 </td> 400 <td> 401 <span class="start_time" time="1363939814" title="2013-03-22 16:10:14"></span> 402 </td> 403 <td> 404 <span class="end_time" time="1410475814" title="2014-09-12 06:50:14"></span> 405 </td> 406 <td> 407 <div class="show_info"> 408 <div> 409 <a href="activity/446/user/list" class="p4">用户</a> 410 </div> 411 <ul class="info_detail" isload="no" act_id="446"> 412 </ul> 413 </div> 414 <a href="activity/446/edit/page" class="p4">编辑</a> <a href="activity/446/setting/page" 415 class="p4">设置</a> <a href="activity/446/messlog/page" class="p4">短信日志</a> <a href="activity/446/demo" 416 class="p4" target="_blank">页面</a> 417 </td> 418 </tr> 419 <tr class=""> 420 <td class=" self_msg"> 421 445 422 </td> 423 <td class=" self_msg"> 424 二级城市巡展南充 425 </td> 426 <td> 427 否 428 </td> 429 <td> 430 <a href="http://cd.house.qq.com/zt2013/ejcsxz/index.htm" title="http://cd.house.qq.com/zt2013/ejcsxz/index.htm" 431 target="_black">查看</a> 432 </td> 433 <td> 434 <span class="start_time" time="1363937768" title="2013-03-22 15:36:08"></span> 435 </td> 436 <td> 437 <span class="end_time" time="1378937768" title="2013-09-12 06:16:08"></span> 438 </td> 439 <td> 440 <div class="show_info"> 441 <div> 442 <a href="activity/445/user/list" class="p4">用户</a> 443 </div> 444 <ul class="info_detail" isload="no" act_id="445"> 445 </ul> 446 </div> 447 <a href="activity/445/edit/page" class="p4">编辑</a> <a href="activity/445/setting/page" 448 class="p4">设置</a> <a href="activity/445/messlog/page" class="p4">短信日志</a> <a href="activity/445/demo" 449 class="p4" target="_blank">页面</a> 450 </td> 451 </tr> 452 <tr class="alt-row"> 453 <td class=" "> 454 435 455 </td> 456 <td class=" "> 457 大众 458 </td> 459 <td> 460 否 461 </td> 462 <td> 463 <a href="http://cd.qq.com/a/20130321/000417.htm" title="http://cd.qq.com/a/20130321/000417.htm" 464 target="_black">查看</a> 465 </td> 466 <td> 467 <span class="start_time" time="1363859423" title="2013-03-21 17:50:23"></span> 468 </td> 469 <td> 470 <span class="end_time" time="1378859423" title="2013-09-11 08:30:23"></span> 471 </td> 472 <td> 473 <div class="show_info"> 474 <div> 475 <a href="activity/435/user/list" class="p4">用户</a> 476 </div> 477 <ul class="info_detail" isload="no" act_id="435"> 478 </ul> 479 </div> 480 <a href="activity/435/edit/page" class="p4">编辑</a> <a href="activity/435/setting/page" 481 class="p4">设置</a> <a href="activity/435/messlog/page" class="p4">短信日志</a> <a href="activity/435/demo" 482 class="p4" target="_blank">页面</a> 483 </td> 484 </tr> 485 <tr class=""> 486 <td class=" "> 487 427 488 </td> 489 <td class=" "> 490 江淮报名 491 </td> 492 <td> 493 否 494 </td> 495 <td> 496 <a href="http://cd.qq.com/a/20130318/000354.htm" title="http://cd.qq.com/a/20130318/000354.htm" 497 target="_black">查看</a> 498 </td> 499 <td> 500 <span class="start_time" time="1363836688" title="2013-03-21 11:31:28"></span> 501 </td> 502 <td> 503 <span class="end_time" time="1386699088" title="2013-12-11 02:11:28"></span> 504 </td> 505 <td> 506 <div class="show_info"> 507 <div> 508 <a href="activity/427/user/list" class="p4">用户</a> 509 </div> 510 <ul class="info_detail" isload="no" act_id="427"> 511 </ul> 512 </div> 513 <a href="activity/427/edit/page" class="p4">编辑</a> <a href="activity/427/setting/page" 514 class="p4">设置</a> <a href="activity/427/messlog/page" class="p4">短信日志</a> <a href="activity/427/demo" 515 class="p4" target="_blank">页面</a> 516 </td> 517 </tr> 518 <tr class="alt-row"> 519 <td class=" "> 520 423 521 </td> 522 <td class=" "> 523 地铁微笑服务月 524 </td> 525 <td> 526 否 527 </td> 528 <td> 529 <a href="http://cd.qq.com/zt2013/2013smile/dtxs.htm" title="http://cd.qq.com/zt2013/2013smile/dtxs.htm" 530 target="_black">查看</a> 531 </td> 532 <td> 533 <span class="start_time" time="1363773456" title="2013-03-20 17:57:36"></span> 534 </td> 535 <td> 536 <span class="end_time" time="1378773456" title="2013-09-10 08:37:36"></span> 537 </td> 538 <td> 539 <div class="show_info"> 540 <div> 541 <a href="activity/423/user/list" class="p4">用户</a> 542 </div> 543 <ul class="info_detail" isload="no" act_id="423"> 544 </ul> 545 </div> 546 <a href="activity/423/edit/page" class="p4">编辑</a> <a href="activity/423/setting/page" 547 class="p4">设置</a> <a href="activity/423/messlog/page" class="p4">短信日志</a> <a href="activity/423/demo" 548 class="p4" target="_blank">页面</a> 549 </td> 550 </tr> 551 <tr class=""> 552 <td class=" "> 553 422 554 </td> 555 <td class=" "> 556 东风风神7折8扣 557 </td> 558 <td> 559 否 560 </td> 561 <td> 562 <a href="http://cd.qq.com/zt2013/dffs/index.htm" title="http://cd.qq.com/zt2013/dffs/index.htm" 563 target="_black">查看</a> 564 </td> 565 <td> 566 <span class="start_time" time="1363772741" title="2013-03-20 17:45:41"></span> 567 </td> 568 <td> 569 <span class="end_time" time="1368145541" title="2013-05-10 08:25:41"></span> 570 </td> 571 <td> 572 <div class="show_info"> 573 <div> 574 <a href="activity/422/user/list" class="p4">用户</a> 575 </div> 576 <ul class="info_detail" isload="no" act_id="422"> 577 </ul> 578 </div> 579 <a href="activity/422/edit/page" class="p4">编辑</a> <a href="activity/422/setting/page" 580 class="p4">设置</a> <a href="activity/422/messlog/page" class="p4">短信日志</a> <a href="activity/422/demo" 581 class="p4" target="_blank">页面</a> 582 </td> 583 </tr> 584 <tr class="alt-row"> 585 <td class=" "> 586 417 587 </td> 588 <td class=" "> 589 2013公积金微笑服务月 590 </td> 591 <td> 592 否 593 </td> 594 <td> 595 <a href="http://cd.qq.com/zt2013/2013smile/GGJHXTPYM.htm" title="http://cd.qq.com/zt2013/2013smile/GGJHXTPYM.htm" 596 target="_black">查看</a> 597 </td> 598 <td> 599 <span class="start_time" time="1363661947" title="2013-03-19 10:59:07"></span> 600 </td> 601 <td> 602 <span class="end_time" time="1378717200" title="2013-09-09 17:00:00"></span> 603 </td> 604 <td> 605 <div class="show_info"> 606 <div> 607 <a href="activity/417/user/list" class="p4">用户</a> 608 </div> 609 <ul class="info_detail" isload="no" act_id="417"> 610 </ul> 611 </div> 612 <a href="activity/417/edit/page" class="p4">编辑</a> <a href="activity/417/setting/page" 613 class="p4">设置</a> <a href="activity/417/messlog/page" class="p4">短信日志</a> <a href="activity/417/demo" 614 class="p4" target="_blank">页面</a> 615 </td> 616 </tr> 617 <tr class=""> 618 <td class=" "> 619 413 620 </td> 621 <td class=" "> 622 2013运营商微笑服务月 623 </td> 624 <td> 625 否 626 </td> 627 <td> 628 <a href="http://cd.qq.com/zt2013/2013smile/yystoupiao.htm" title="http://cd.qq.com/zt2013/2013smile/yystoupiao.htm" 629 target="_black">查看</a> 630 </td> 631 <td> 632 <span class="start_time" time="1363687997" title="2013-03-19 18:13:17"></span> 633 </td> 634 <td> 635 <span class="end_time" time="1378687997" title="2013-09-09 08:53:17"></span> 636 </td> 637 <td> 638 <div class="show_info"> 639 <div> 640 <a href="activity/413/user/list" class="p4">用户</a> 641 </div> 642 <ul class="info_detail" isload="no" act_id="413"> 643 </ul> 644 </div> 645 <a href="activity/413/edit/page" class="p4">编辑</a> <a href="activity/413/setting/page" 646 class="p4">设置</a> <a href="activity/413/messlog/page" class="p4">短信日志</a> <a href="activity/413/demo" 647 class="p4" target="_blank">页面</a> 648 </td> 649 </tr> 650 <tr class="alt-row"> 651 <td class=" activity_end "> 652 412 653 </td> 654 <td class=" activity_end "> 655 《北京遇上西雅图》周末超低价仅25元！ 656 </td> 657 <td> 658 是(type1) 659 </td> 660 <td> 661 <a href="http://cd.qq.com/zt2013/ikan7" title="http://cd.qq.com/zt2013/ikan7" target="_black"> 662 查看</a> 663 </td> 664 <td> 665 <span class="start_time" time="1363685311" title="2013-03-19 17:28:31"></span> 666 </td> 667 <td> 668 <span class="end_time" time="1363964911" title="2013-03-22 23:08:31"></span> 669 </td> 670 <td> 671 <div class="show_info"> 672 <div> 673 <a href="activity/412/user/list" class="p4">用户</a> 674 </div> 675 <ul class="info_detail" isload="no" act_id="412"> 676 </ul> 677 </div> 678 <a href="activity/412/edit/page" class="p4">编辑</a> <a href="activity/412/setting/page" 679 class="p4">设置</a> <a href="activity/412/messlog/page" class="p4">短信日志</a> <a href="activity/412/demo" 680 class="p4" target="_blank">页面</a> 681 </td> 682 </tr> 683 <tr class=""> 684 <td class=" activity_end self_msg"> 685 410 686 </td> 687 <td class=" activity_end self_msg"> 688 泸州春季看房团 689 </td> 690 <td> 691 否 692 </td> 693 <td> 694 <a href="http://cd.qq.com/zt2013/2013lzcjkft/index.htm" title="http://cd.qq.com/zt2013/2013lzcjkft/index.htm" 695 target="_black">查看</a> 696 </td> 697 <td> 698 <span class="start_time" time="1363680369" title="2013-03-19 16:06:09"></span> 699 </td> 700 <td> 701 <span class="end_time" time="1364571969" title="2013-03-29 23:46:09"></span> 702 </td> 703 <td> 704 <div class="show_info"> 705 <div> 706 <a href="activity/410/user/list" class="p4">用户</a> 707 </div> 708 <ul class="info_detail" isload="no" act_id="410"> 709 </ul> 710 </div> 711 <a href="activity/410/edit/page" class="p4">编辑</a> <a href="activity/410/setting/page" 712 class="p4">设置</a> <a href="activity/410/messlog/page" class="p4">短信日志</a> <a href="activity/410/demo" 713 class="p4" target="_blank">页面</a> 714 </td> 715 </tr> 716 <tr class="alt-row"> 717 <td class=" "> 718 407 719 </td> 720 <td class=" "> 721 2013金融微笑服务月 722 </td> 723 <td> 724 否 725 </td> 726 <td> 727 <a href="http://cd.qq.com/zt2013/2013smile/2013banksmile.htm" title="http://cd.qq.com/zt2013/2013smile/2013banksmile.htm" 728 target="_black">查看</a> 729 </td> 730 <td> 731 <span class="start_time" time="1363661947" title="2013-03-19 10:59:07"></span> 732 </td> 733 <td> 734 <span class="end_time" time="1378717200" title="2013-09-09 17:00:00"></span> 735 </td> 736 <td> 737 <div class="show_info"> 738 <div> 739 <a href="activity/407/user/list" class="p4">用户</a> 740 </div> 741 <ul class="info_detail" isload="no" act_id="407"> 742 </ul> 743 </div> 744 <a href="activity/407/edit/page" class="p4">编辑</a> <a href="activity/407/setting/page" 745 class="p4">设置</a> <a href="activity/407/messlog/page" class="p4">短信日志</a> <a href="activity/407/demo" 746 class="p4" target="_blank">页面</a> 747 </td> 748 </tr> 749 <tr class=""> 750 <td class=" activity_end self_msg"> 751 400 752 </td> 753 <td class=" activity_end self_msg"> 754 德尔地板3月30日活动 755 </td> 756 <td> 757 是(type1) 758 </td> 759 <td> 760 <a href="http://mycd.qq.com/t-809172-1.htm" title="http://mycd.qq.com/t-809172-1.htm" 761 target="_black">查看</a> 762 </td> 763 <td> 764 <span class="start_time" time="1363591901" title="2013-03-18 15:31:41"></span> 765 </td> 766 <td> 767 <span class="end_time" time="1364595101" title="2013-03-30 06:11:41"></span> 768 </td> 769 <td> 770 <div class="show_info"> 771 <div> 772 <a href="activity/400/user/list" class="p4">用户</a> 773 </div> 774 <ul class="info_detail" isload="no" act_id="400"> 775 </ul> 776 </div> 777 <a href="activity/400/edit/page" class="p4">编辑</a> <a href="activity/400/setting/page" 778 class="p4">设置</a> <a href="activity/400/messlog/page" class="p4">短信日志</a> <a href="activity/400/demo" 779 class="p4" target="_blank">页面</a> 780 </td> 781 </tr> 782 <tr class="alt-row"> 783 <td class=" activity_end "> 784 396 785 </td> 786 <td class=" activity_end "> 787 成都西湖之旅 788 </td> 789 <td> 790 是(type2) 791 </td> 792 <td> 793 <a href="http://cd.qq.com/zt2013/cdxhzl/index.htm" title="http://cd.qq.com/zt2013/cdxhzl/index.htm" 794 target="_black">查看</a> 795 </td> 796 <td> 797 <span class="start_time" time="1363571618" title="2013-03-18 09:53:38"></span> 798 </td> 799 <td> 800 <span class="end_time" time="1364140538" title="2013-03-24 23:55:38"></span> 801 </td> 802 <td> 803 <div class="show_info"> 804 <div> 805 <a href="activity/396/user/list" class="p4">用户</a> 806 </div> 807 <ul class="info_detail" isload="no" act_id="396"> 808 </ul> 809 </div> 810 <a href="activity/396/edit/page" class="p4">编辑</a> <a href="activity/396/setting/page" 811 class="p4">设置</a> <a href="activity/396/messlog/page" class="p4">短信日志</a> <a href="activity/396/demo" 812 class="p4" target="_blank">页面</a> 813 </td> 814 </tr> 815 <tr class=""> 816 <td class=" self_msg"> 817 388 818 </td> 819 <td class=" self_msg"> 820 理财大学堂会员申请表 821 </td> 822 <td> 823 是(type1) 824 </td> 825 <td> 826 <a href="http://cd.qq.com/zt2011/fpclass/index.htm" title="http://cd.qq.com/zt2011/fpclass/index.htm" 827 target="_black">查看</a> 828 </td> 829 <td> 830 <span class="start_time" time="1363330800" title="2013-03-15 15:00:00"></span> 831 </td> 832 <td> 833 <span class="end_time" time="1420041599" title="2014-12-31 23:59:59"></span> 834 </td> 835 <td> 836 <div class="show_info"> 837 <div> 838 <a href="activity/388/user/list" class="p4">用户</a> 839 </div> 840 <ul class="info_detail" isload="no" act_id="388"> 841 </ul> 842 </div> 843 <a href="activity/388/edit/page" class="p4">编辑</a> <a href="activity/388/setting/page" 844 class="p4">设置</a> <a href="activity/388/messlog/page" class="p4">短信日志</a> <a href="activity/388/demo" 845 class="p4" target="_blank">页面</a> 846 </td> 847 </tr> 848 <tr class="alt-row"> 849 <td class=" activity_end self_msg"> 850 375 851 </td> 852 <td class=" activity_end self_msg"> 853 蒙地卡罗3月23日 854 </td> 855 <td> 856 是(type1) 857 </td> 858 <td> 859 <a href="http://mycd.qq.com/t-804537-1.htm" title="http://mycd.qq.com/t-804537-1.htm" 860 target="_black">查看</a> 861 </td> 862 <td> 863 <span class="start_time" time="1363074954" title="2013-03-12 15:55:54"></span> 864 </td> 865 <td> 866 <span class="end_time" time="1363952154" title="2013-03-22 19:35:54"></span> 867 </td> 868 <td> 869 <div class="show_info"> 870 <div> 871 <a href="activity/375/user/list" class="p4">用户</a> 872 </div> 873 <ul class="info_detail" isload="no" act_id="375"> 874 </ul> 875 </div> 876 <a href="activity/375/edit/page" class="p4">编辑</a> <a href="activity/375/setting/page" 877 class="p4">设置</a> <a href="activity/375/messlog/page" class="p4">短信日志</a> <a href="activity/375/demo" 878 class="p4" target="_blank">页面</a> 879 </td> 880 </tr> 881 <tr class=""> 882 <td class=" activity_end "> 883 373 884 </td> 885 <td class=" activity_end "> 886 东风雪铁龙 887 </td> 888 <td> 889 否 890 </td> 891 <td> 892 <a href="http://cd.qq.com/zt2013/dfxtl/index.htm" title="http://cd.qq.com/zt2013/dfxtl/index.htm" 893 target="_black">查看</a> 894 </td> 895 <td> 896 <span class="start_time" time="1363073268" title="2013-03-12 15:27:48"></span> 897 </td> 898 <td> 899 <span class="end_time" time="1363903668" title="2013-03-22 06:07:48"></span> 900 </td> 901 <td> 902 <div class="show_info"> 903 <div> 904 <a href="activity/373/user/list" class="p4">用户</a> 905 </div> 906 <ul class="info_detail" isload="no" act_id="373"> 907 </ul> 908 </div> 909 <a href="activity/373/edit/page" class="p4">编辑</a> <a href="activity/373/setting/page" 910 class="p4">设置</a> <a href="activity/373/messlog/page" class="p4">短信日志</a> <a href="activity/373/demo" 911 class="p4" target="_blank">页面</a> 912 </td> 913 </tr> 914 <tr class="alt-row"> 915 <td class=" activity_end "> 916 372 917 </td> 918 <td class=" activity_end "> 919 《虎胆龙威5》周五DMAX巨幕厅仅25元！ 920 </td> 921 <td> 922 是(type1) 923 </td> 924 <td> 925 <a href="http://cd.qq.com/zt2013/ikan5" title="http://cd.qq.com/zt2013/ikan5" target="_black"> 926 查看</a> 927 </td> 928 <td> 929 <span class="start_time" time="1363073218" title="2013-03-12 15:26:58"></span> 930 </td> 931 <td> 932 <span class="end_time" time="1363330800" title="2013-03-15 15:00:00"></span> 933 </td> 934 <td> 935 <div class="show_info"> 936 <div> 937 <a href="activity/372/user/list" class="p4">用户</a> 938 </div> 939 <ul class="info_detail" isload="no" act_id="372"> 940 </ul> 941 </div> 942 <a href="activity/372/edit/page" class="p4">编辑</a> <a href="activity/372/setting/page" 943 class="p4">设置</a> <a href="activity/372/messlog/page" class="p4">短信日志</a> <a href="activity/372/demo" 944 class="p4" target="_blank">页面</a> 945 </td> 946 </tr> 947 <tr class=""> 948 <td class=" activity_end "> 949 366 950 </td> 951 <td class=" activity_end "> 952 区域看房团第7期 953 </td> 954 <td> 955 否 956 </td> 957 <td> 958 <a href="http://cd.house.qq.com/zt2013/quyu7/index.htm" title="http://cd.house.qq.com/zt2013/quyu7/index.htm" 959 target="_black">查看</a> 960 </td> 961 <td> 962 <span class="start_time" time="1362931200" title="2013-03-11 00:00:00"></span> 963 </td> 964 <td> 965 <span class="end_time" time="1363881600" title="2013-03-22 00:00:00"></span> 966 </td> 967 <td> 968 <div class="show_info"> 969 <div> 970 <a href="activity/366/user/list" class="p4">用户</a> 971 </div> 972 <ul class="info_detail" isload="no" act_id="366"> 973 </ul> 974 </div> 975 <a href="activity/366/edit/page" class="p4">编辑</a> <a href="activity/366/setting/page" 976 class="p4">设置</a> <a href="activity/366/messlog/page" class="p4">短信日志</a> <a href="activity/366/demo" 977 class="p4" target="_blank">页面</a> 978 </td> 979 </tr> 980 <tr class="alt-row"> 981 <td class=" activity_end self_msg"> 982 358 983 </td> 984 <td class=" activity_end self_msg"> 985 浪度家私3月23日活动 986 </td> 987 <td> 988 否 989 </td> 990 <td> 991 <a href="http://mycd.qq.com/t-803765-1.htm" title="http://mycd.qq.com/t-803765-1.htm" 992 target="_black">查看</a> 993 </td> 994 <td> 995 <span class="start_time" time="1362973252" title="2013-03-11 11:40:52"></span> 996 </td> 997 <td> 998 <span class="end_time" time="1363976452" title="2013-03-23 02:20:52"></span> 999 </td> 1000 <td> 1001 <div class="show_info"> 1002 <div> 1003 <a href="activity/358/user/list" class="p4">用户</a> 1004 </div> 1005 <ul class="info_detail" isload="no" act_id="358"> 1006 </ul> 1007 </div> 1008 <a href="activity/358/edit/page" class="p4">编辑</a> <a href="activity/358/setting/page" 1009 class="p4">设置</a> <a href="activity/358/messlog/page" class="p4">短信日志</a> <a href="activity/358/demo" 1010 class="p4" target="_blank">页面</a> 1011 </td> 1012 </tr> 1013 <tr class=""> 1014 <td class=" activity_end "> 1015 353 1016 </td> 1017 <td class=" activity_end "> 1018 华侨凤凰城 1019 </td> 1020 <td> 1021 否 1022 </td> 1023 <td> 1024 <a href="http://cd.qq.com/zt2013/2013hqfhc/index.htm" title="http://cd.qq.com/zt2013/2013hqfhc/index.htm" 1025 target="_black">查看</a> 1026 </td> 1027 <td> 1028 <span class="start_time" time="1362709403" title="2013-03-08 10:23:23"></span> 1029 </td> 1030 <td> 1031 <span class="end_time" time="1364745323" title="2013-03-31 23:55:23"></span> 1032 </td> 1033 <td> 1034 <div class="show_info"> 1035 <div> 1036 <a href="activity/353/user/list" class="p4">用户</a> 1037 </div> 1038 <ul class="info_detail" isload="no" act_id="353"> 1039 </ul> 1040 </div> 1041 <a href="activity/353/edit/page" class="p4">编辑</a> <a href="activity/353/setting/page" 1042 class="p4">设置</a> <a href="activity/353/messlog/page" class="p4">短信日志</a> <a href="activity/353/demo" 1043 class="p4" target="_blank">页面</a> 1044 </td> 1045 </tr> 1046 <tr class="alt-row"> 1047 <td class=" activity_end "> 1048 352 1049 </td> 1050 <td class=" activity_end "> 1051 Q房狂省团第20期 1052 </td> 1053 <td> 1054 否 1055 </td> 1056 <td> 1057 <a href="http://cd.house.qq.com/zt2013/kst20/index.htm" title="http://cd.house.qq.com/zt2013/kst20/index.htm" 1058 target="_black">查看</a> 1059 </td> 1060 <td> 1061 <span class="start_time" time="1362707718" title="2013-03-08 09:55:18"></span> 1062 </td> 1063 <td> 1064 <span class="end_time" time="1363536000" title="2013-03-18 00:00:00"></span> 1065 </td> 1066 <td> 1067 <div class="show_info"> 1068 <div> 1069 <a href="activity/352/user/list" class="p4">用户</a> 1070 </div> 1071 <ul class="info_detail" isload="no" act_id="352"> 1072 </ul> 1073 </div> 1074 <a href="activity/352/edit/page" class="p4">编辑</a> <a href="activity/352/setting/page" 1075 class="p4">设置</a> <a href="activity/352/messlog/page" class="p4">短信日志</a> <a href="activity/352/demo" 1076 class="p4" target="_blank">页面</a> 1077 </td> 1078 </tr> 1079 <tr class=""> 1080 <td class=" activity_end self_msg"> 1081 351 1082 </td> 1083 <td class=" activity_end self_msg"> 1084 图腾宝佳3月31日活动 1085 </td> 1086 <td> 1087 是(type1) 1088 </td> 1089 <td> 1090 <a href="http://mycd.qq.com/t-801349-1.htm" title="http://mycd.qq.com/t-801349-1.htm" 1091 target="_black">查看</a> 1092 </td> 1093 <td> 1094 <span class="start_time" time="1362651113" title="2013-03-07 18:11:53"></span> 1095 </td> 1096 <td> 1097 <span class="end_time" time="1364604713" title="2013-03-30 08:51:53"></span> 1098 </td> 1099 <td> 1100 <div class="show_info"> 1101 <div> 1102 <a href="activity/351/user/list" class="p4">用户</a> 1103 </div> 1104 <ul class="info_detail" isload="no" act_id="351"> 1105 </ul> 1106 </div> 1107 <a href="activity/351/edit/page" class="p4">编辑</a> <a href="activity/351/setting/page" 1108 class="p4">设置</a> <a href="activity/351/messlog/page" class="p4">短信日志</a> <a href="activity/351/demo" 1109 class="p4" target="_blank">页面</a> 1110 </td> 1111 </tr> 1112 <tr class="alt-row"> 1113 <td class=" "> 1114 349 1115 </td> 1116 <td class=" "> 1117 惠装商城 1118 </td> 1119 <td> 1120 否 1121 </td> 1122 <td> 1123 <a href="http://cd.qq.com/zt2013/huizhuang/index.htm" title="http://cd.qq.com/zt2013/huizhuang/index.htm" 1124 target="_black">查看</a> 1125 </td> 1126 <td> 1127 <span class="start_time" time="1362649536" title="2013-03-07 17:45:36"></span> 1128 </td> 1129 <td> 1130 <span class="end_time" time="1365121536" title="2013-04-05 08:25:36"></span> 1131 </td> 1132 <td> 1133 <div class="show_info"> 1134 <div> 1135 <a href="activity/349/user/list" class="p4">用户</a> 1136 </div> 1137 <ul class="info_detail" isload="no" act_id="349"> 1138 </ul> 1139 </div> 1140 <a href="activity/349/edit/page" class="p4">编辑</a> <a href="activity/349/setting/page" 1141 class="p4">设置</a> <a href="activity/349/messlog/page" class="p4">短信日志</a> <a href="activity/349/demo" 1142 class="p4" target="_blank">页面</a> 1143 </td> 1144 </tr> 1145 <tr class=""> 1146 <td class=" "> 1147 346 1148 </td> 1149 <td class=" "> 1150 天立贵宾会 1151 </td> 1152 <td> 1153 否 1154 </td> 1155 <td> 1156 <a href="http://mycd.qq.com/forum.php?mod=viewthread&tid=799585" title="http://mycd.qq.com/forum.php?mod=viewthread&tid=799585" 1157 target="_black">查看</a> 1158 </td> 1159 <td> 1160 <span class="start_time" time="1362625682" title="2013-03-07 11:08:02"></span> 1161 </td> 1162 <td> 1163 <span class="end_time" time="1388425682" title="2013-12-31 01:48:02"></span> 1164 </td> 1165 <td> 1166 <div class="show_info"> 1167 <div> 1168 <a href="activity/346/user/list" class="p4">用户</a> 1169 </div> 1170 <ul class="info_detail" isload="no" act_id="346"> 1171 </ul> 1172 </div> 1173 <a href="activity/346/edit/page" class="p4">编辑</a> <a href="activity/346/setting/page" 1174 class="p4">设置</a> <a href="activity/346/messlog/page" class="p4">短信日志</a> <a href="activity/346/demo" 1175 class="p4" target="_blank">页面</a> 1176 </td> 1177 </tr> 1178 <tr class="alt-row"> 1179 <td class=" activity_end "> 1180 344 1181 </td> 1182 <td class=" activity_end "> 1183 美景舒适家3月活动 1184 </td> 1185 <td> 1186 否 1187 </td> 1188 <td> 1189 <a href="http://cd.qq.com/a/20130307/000300.htm" title="http://cd.qq.com/a/20130307/000300.htm" 1190 target="_black">查看</a> 1191 </td> 1192 <td> 1193 <span class="start_time" time="1362619219" title="2013-03-07 09:20:19"></span> 1194 </td> 1195 <td> 1196 <span class="end_time" time="1362672019" title="2013-03-08 00:00:19"></span> 1197 </td> 1198 <td> 1199 <div class="show_info"> 1200 <div> 1201 <a href="activity/344/user/list" class="p4">用户</a> 1202 </div> 1203 <ul class="info_detail" isload="no" act_id="344"> 1204 </ul> 1205 </div> 1206 <a href="activity/344/edit/page" class="p4">编辑</a> <a href="activity/344/setting/page" 1207 class="p4">设置</a> <a href="activity/344/messlog/page" class="p4">短信日志</a> <a href="activity/344/demo" 1208 class="p4" target="_blank">页面</a> 1209 </td> 1210 </tr> 1211 <tr class=""> 1212 <td class=" activity_end "> 1213 330 1214 </td> 1215 <td class=" activity_end "> 1216 家居315活动 1217 </td> 1218 <td> 1219 是(type1) 1220 </td> 1221 <td> 1222 <a href="http://mycd.qq.com/t-799700-1.htm" title="http://mycd.qq.com/t-799700-1.htm" 1223 target="_black">查看</a> 1224 </td> 1225 <td> 1226 <span class="start_time" time="1362450771" title="2013-03-05 10:32:51"></span> 1227 </td> 1228 <td> 1229 <span class="end_time" time="1363453971" title="2013-03-17 01:12:51"></span> 1230 </td> 1231 <td> 1232 <div class="show_info"> 1233 <div> 1234 <a href="activity/330/user/list" class="p4">用户</a> 1235 </div> 1236 <ul class="info_detail" isload="no" act_id="330"> 1237 </ul> 1238 </div> 1239 <a href="activity/330/edit/page" class="p4">编辑</a> <a href="activity/330/setting/page" 1240 class="p4">设置</a> <a href="activity/330/messlog/page" class="p4">短信日志</a> <a href="activity/330/demo" 1241 class="p4" target="_blank">页面</a> 1242 </td> 1243 </tr> 1244 <tr class="alt-row"> 1245 <td class=" activity_end "> 1246 329 1247 </td> 1248 <td class=" activity_end "> 1249 艾力绅家庭日 移动梦想家 1250 </td> 1251 <td> 1252 否 1253 </td> 1254 <td> 1255 <a href="http://cd.qq.com/zt2013/ELYSION/index.htm" title="http://cd.qq.com/zt2013/ELYSION/index.htm" 1256 target="_black">查看</a> 1257 </td> 1258 <td> 1259 <span class="start_time" time="1362449178" title="2013-03-05 10:06:18"></span> 1260 </td> 1261 <td> 1262 <span class="end_time" time="1362758118" title="2013-03-08 23:55:18"></span> 1263 </td> 1264 <td> 1265 <div class="show_info"> 1266 <div> 1267 <a href="activity/329/user/list" class="p4">用户</a> 1268 </div> 1269 <ul class="info_detail" isload="no" act_id="329"> 1270 </ul> 1271 </div> 1272 <a href="activity/329/edit/page" class="p4">编辑</a> <a href="activity/329/setting/page" 1273 class="p4">设置</a> <a href="activity/329/messlog/page" class="p4">短信日志</a> <a href="activity/329/demo" 1274 class="p4" target="_blank">页面</a> 1275 </td> 1276 </tr> 1277 <tr class=""> 1278 <td class=" activity_end "> 1279 301 1280 </td> 1281 <td class=" activity_end "> 1282 千川木门2013当红特让 1283 </td> 1284 <td> 1285 否 1286 </td> 1287 <td> 1288 <a href="http://cd.qq.com/zt2013/2013dhtr/cdz.htm" title="http://cd.qq.com/zt2013/2013dhtr/cdz.htm" 1289 target="_black">查看</a> 1290 </td> 1291 <td> 1292 <span class="start_time" time="1361956033" title="2013-02-27 17:07:13"></span> 1293 </td> 1294 <td> 1295 <span class="end_time" time="1363362913" title="2013-03-15 23:55:13"></span> 1296 </td> 1297 <td> 1298 <div class="show_info"> 1299 <div> 1300 <a href="activity/301/user/list" class="p4">用户</a> 1301 </div> 1302 <ul class="info_detail" isload="no" act_id="301"> 1303 </ul> 1304 </div> 1305 <a href="activity/301/edit/page" class="p4">编辑</a> <a href="activity/301/setting/page" 1306 class="p4">设置</a> <a href="activity/301/messlog/page" class="p4">短信日志</a> <a href="activity/301/demo" 1307 class="p4" target="_blank">页面</a> 1308 </td> 1309 </tr> 1310 <tr class="alt-row"> 1311 <td class=" "> 1312 300 1313 </td> 1314 <td class=" "> 1315 flash_test_kylefeng 1316 </td> 1317 <td> 1318 否 1319 </td> 1320 <td> 1321 <a href="http://cd.qq.com" title="http://cd.qq.com" target="_black">查看</a> 1322 </td> 1323 <td> 1324 <span class="start_time" time="1361951329" title="2013-02-27 15:48:49"></span> 1325 </td> 1326 <td> 1327 <span class="end_time" time="1376951329" title="2013-08-20 06:28:49"></span> 1328 </td> 1329 <td> 1330 <div class="show_info"> 1331 <div> 1332 <a href="activity/300/user/list" class="p4">用户</a> 1333 </div> 1334 <ul class="info_detail" isload="no" act_id="300"> 1335 </ul> 1336 </div> 1337 <a href="activity/300/edit/page" class="p4">编辑</a> <a href="activity/300/setting/page" 1338 class="p4">设置</a> <a href="activity/300/messlog/page" class="p4">短信日志</a> <a href="activity/300/demo" 1339 class="p4" target="_blank">页面</a> 1340 </td> 1341 </tr> 1342 <tr class=""> 1343 <td class=" activity_end "> 1344 295 1345 </td> 1346 <td class=" activity_end "> 1347 《霍比特人》DMAX巨幕厅3D团看仅30元！ 1348 </td> 1349 <td> 1350 是(type1) 1351 </td> 1352 <td> 1353 <a href="http://cd.qq.com/zt2013/ikan3" title="http://cd.qq.com/zt2013/ikan3" target="_black"> 1354 查看</a> 1355 </td> 1356 <td> 1357 <span class="start_time" time="1361861839" title="2013-02-26 14:57:19"></span> 1358 </td> 1359 <td> 1360 <span class="end_time" time="1362128400" title="2013-03-01 17:00:00"></span> 1361 </td> 1362 <td> 1363 <div class="show_info"> 1364 <div> 1365 <a href="activity/295/user/list" class="p4">用户</a> 1366 </div> 1367 <ul class="info_detail" isload="no" act_id="295"> 1368 </ul> 1369 </div> 1370 <a href="activity/295/edit/page" class="p4">编辑</a> <a href="activity/295/setting/page" 1371 class="p4">设置</a> <a href="activity/295/messlog/page" class="p4">短信日志</a> <a href="activity/295/demo" 1372 class="p4" target="_blank">页面</a> 1373 </td> 1374 </tr> 1375 <tr class="alt-row"> 1376 <td class=" activity_end self_msg"> 1377 280 1378 </td> 1379 <td class=" activity_end self_msg"> 1380 3月17日第9届家居团购节 1381 </td> 1382 <td> 1383 是(type1) 1384 </td> 1385 <td> 1386 <a href="http://cd.qq.com/jiaju/" title="http://cd.qq.com/jiaju/" target="_black">查看</a> 1387 </td> 1388 <td> 1389 <span class="start_time" time="1361352873" title="2013-02-20 17:34:33"></span> 1390 </td> 1391 <td> 1392 <span class="end_time" time="1363344933" title="2013-03-15 18:55:33"></span> 1393 </td> 1394 <td> 1395 <div class="show_info"> 1396 <div> 1397 <a href="activity/280/user/list" class="p4">用户</a> 1398 </div> 1399 <ul class="info_detail" isload="no" act_id="280"> 1400 </ul> 1401 </div> 1402 <a href="activity/280/edit/page" class="p4">编辑</a> <a href="activity/280/setting/page" 1403 class="p4">设置</a> <a href="activity/280/messlog/page" class="p4">短信日志</a> <a href="activity/280/demo" 1404 class="p4" target="_blank">页面</a> 1405 </td> 1406 </tr> 1407 <tr class=""> 1408 <td class=" activity_end self_msg"> 1409 278 1410 </td> 1411 <td class=" activity_end self_msg"> 1412 3月17日千川木门 1413 </td> 1414 <td> 1415 是(type1) 1416 </td> 1417 <td> 1418 <a href="http://cd.qq.com/jiaju/" title="http://cd.qq.com/jiaju/" target="_black">查看</a> 1419 </td> 1420 <td> 1421 <span class="start_time" time="1361342533" title="2013-02-20 14:42:13"></span> 1422 </td> 1423 <td> 1424 <span class="end_time" time="1363362913" title="2013-03-15 23:55:13"></span> 1425 </td> 1426 <td> 1427 <div class="show_info"> 1428 <div> 1429 <a href="activity/278/user/list" class="p4">用户</a> 1430 </div> 1431 <ul class="info_detail" isload="no" act_id="278"> 1432 </ul> 1433 </div> 1434 <a href="activity/278/edit/page" class="p4">编辑</a> <a href="activity/278/setting/page" 1435 class="p4">设置</a> <a href="activity/278/messlog/page" class="p4">短信日志</a> <a href="activity/278/demo" 1436 class="p4" target="_blank">页面</a> 1437 </td> 1438 </tr> 1439 <tr class="alt-row"> 1440 <td class=" activity_end self_msg"> 1441 276 1442 </td> 1443 <td class=" activity_end self_msg"> 1444 升达地板专场 1445 </td> 1446 <td> 1447 是(type1) 1448 </td> 1449 <td> 1450 <a href="http://mycd.qq.com/t-790584-1.htm" title="http://mycd.qq.com/t-790584-1.htm" 1451 target="_black">查看</a> 1452 </td> 1453 <td> 1454 <span class="start_time" time="1361323911" title="2013-02-20 09:31:51"></span> 1455 </td> 1456 <td> 1457 <span class="end_time" time="1362154311" title="2013-03-02 00:11:51"></span> 1458 </td> 1459 <td> 1460 <div class="show_info"> 1461 <div> 1462 <a href="activity/276/user/list" class="p4">用户</a> 1463 </div> 1464 <ul class="info_detail" isload="no" act_id="276"> 1465 </ul> 1466 </div> 1467 <a href="activity/276/edit/page" class="p4">编辑</a> <a href="activity/276/setting/page" 1468 class="p4">设置</a> <a href="activity/276/messlog/page" class="p4">短信日志</a> <a href="activity/276/demo" 1469 class="p4" target="_blank">页面</a> 1470 </td> 1471 </tr> 1472 <tr class=""> 1473 <td class=" "> 1474 272 1475 </td> 1476 <td class=" "> 1477 《西游》《霍比特人》报名 1478 </td> 1479 <td> 1480 是(type1) 1481 </td> 1482 <td> 1483 <a href="http://cd.qq.com/zt2013/ikan1/" title="http://cd.qq.com/zt2013/ikan1/" target="_black"> 1484 查看</a> 1485 </td> 1486 <td> 1487 <span class="start_time" time="1361261417" title="2013-02-19 16:10:17"></span> 1488 </td> 1489 <td> 1490 <span class="end_time" time="1377250200" title="2013-08-23 17:30:00"></span> 1491 </td> 1492 <td> 1493 <div class="show_info"> 1494 <div> 1495 <a href="activity/272/user/list" class="p4">用户</a> 1496 </div> 1497 <ul class="info_detail" isload="no" act_id="272"> 1498 </ul> 1499 </div> 1500 <a href="activity/272/edit/page" class="p4">编辑</a> <a href="activity/272/setting/page" 1501 class="p4">设置</a> <a href="activity/272/messlog/page" class="p4">短信日志</a> <a href="activity/272/demo" 1502 class="p4" target="_blank">页面</a> 1503 </td> 1504 </tr> 1505 <tr class="alt-row"> 1506 <td class=" activity_end "> 1507 271 1508 </td> 1509 <td class=" activity_end "> 1510 结婚采购第二季--九时酒刻 1511 </td> 1512 <td> 1513 是(type1) 1514 </td> 1515 <td> 1516 <a href="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" title="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" 1517 target="_black">查看</a> 1518 </td> 1519 <td> 1520 <span class="start_time" time="1361261274" title="2013-02-19 16:07:54"></span> 1521 </td> 1522 <td> 1523 <span class="end_time" time="1362585354" title="2013-03-06 23:55:54"></span> 1524 </td> 1525 <td> 1526 <div class="show_info"> 1527 <div> 1528 <a href="activity/271/user/list" class="p4">用户</a> 1529 </div> 1530 <ul class="info_detail" isload="no" act_id="271"> 1531 </ul> 1532 </div> 1533 <a href="activity/271/edit/page" class="p4">编辑</a> <a href="activity/271/setting/page" 1534 class="p4">设置</a> <a href="activity/271/messlog/page" class="p4">短信日志</a> <a href="activity/271/demo" 1535 class="p4" target="_blank">页面</a> 1536 </td> 1537 </tr> 1538 <tr class=""> 1539 <td class=" activity_end "> 1540 269 1541 </td> 1542 <td class=" activity_end "> 1543 2013结婚采购季 1544 </td> 1545 <td> 1546 是(type1) 1547 </td> 1548 <td> 1549 <a href="http://cd.qq.com/wedding/" title="http://cd.qq.com/wedding/" target="_black"> 1550 查看</a> 1551 </td> 1552 <td> 1553 <span class="start_time" time="1361173787" title="2013-02-18 15:49:47"></span> 1554 </td> 1555 <td> 1556 <span class="end_time" time="1363732187" title="2013-03-20 06:29:47"></span> 1557 </td> 1558 <td> 1559 <div class="show_info"> 1560 <div> 1561 <a href="activity/269/user/list" class="p4">用户</a> 1562 </div> 1563 <ul class="info_detail" isload="no" act_id="269"> 1564 </ul> 1565 </div> 1566 <a href="activity/269/edit/page" class="p4">编辑</a> <a href="activity/269/setting/page" 1567 class="p4">设置</a> <a href="activity/269/messlog/page" class="p4">短信日志</a> <a href="activity/269/demo" 1568 class="p4" target="_blank">页面</a> 1569 </td> 1570 </tr> 1571 <tr class="alt-row"> 1572 <td class=" "> 1573 268 1574 </td> 1575 <td class=" "> 1576 结婚采购第二季--W妆点 1577 </td> 1578 <td> 1579 是(type1) 1580 </td> 1581 <td> 1582 <a href="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" title="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" 1583 target="_black">查看</a> 1584 </td> 1585 <td> 1586 <span class="start_time" time="1361152302" title="2013-02-18 09:51:42"></span> 1587 </td> 1588 <td> 1589 <span class="end_time" time="1365263742" title="2013-04-06 23:55:42"></span> 1590 </td> 1591 <td> 1592 <div class="show_info"> 1593 <div> 1594 <a href="activity/268/user/list" class="p4">用户</a> 1595 </div> 1596 <ul class="info_detail" isload="no" act_id="268"> 1597 </ul> 1598 </div> 1599 <a href="activity/268/edit/page" class="p4">编辑</a> <a href="activity/268/setting/page" 1600 class="p4">设置</a> <a href="activity/268/messlog/page" class="p4">短信日志</a> <a href="activity/268/demo" 1601 class="p4" target="_blank">页面</a> 1602 </td> 1603 </tr> 1604 <tr class=""> 1605 <td class=" activity_end "> 1606 267 1607 </td> 1608 <td class=" activity_end "> 1609 结婚采购第二季--钻石新娘 1610 </td> 1611 <td> 1612 是(type1) 1613 </td> 1614 <td> 1615 <a href="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" title="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" 1616 target="_black">查看</a> 1617 </td> 1618 <td> 1619 <span class="start_time" time="1361152164" title="2013-02-18 09:49:24"></span> 1620 </td> 1621 <td> 1622 <span class="end_time" time="1362585324" title="2013-03-06 23:55:24"></span> 1623 </td> 1624 <td> 1625 <div class="show_info"> 1626 <div> 1627 <a href="activity/267/user/list" class="p4">用户</a> 1628 </div> 1629 <ul class="info_detail" isload="no" act_id="267"> 1630 </ul> 1631 </div> 1632 <a href="activity/267/edit/page" class="p4">编辑</a> <a href="activity/267/setting/page" 1633 class="p4">设置</a> <a href="activity/267/messlog/page" class="p4">短信日志</a> <a href="activity/267/demo" 1634 class="p4" target="_blank">页面</a> 1635 </td> 1636 </tr> 1637 <tr class="alt-row"> 1638 <td class=" activity_end "> 1639 266 1640 </td> 1641 <td class=" activity_end "> 1642 结婚采购第二季--维也纳 1643 </td> 1644 <td> 1645 是(type1) 1646 </td> 1647 <td> 1648 <a href="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" title="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" 1649 target="_black">查看</a> 1650 </td> 1651 <td> 1652 <span class="start_time" time="1361152081" title="2013-02-18 09:48:01"></span> 1653 </td> 1654 <td> 1655 <span class="end_time" time="1362585301" title="2013-03-06 23:55:01"></span> 1656 </td> 1657 <td> 1658 <div class="show_info"> 1659 <div> 1660 <a href="activity/266/user/list" class="p4">用户</a> 1661 </div> 1662 <ul class="info_detail" isload="no" act_id="266"> 1663 </ul> 1664 </div> 1665 <a href="activity/266/edit/page" class="p4">编辑</a> <a href="activity/266/setting/page" 1666 class="p4">设置</a> <a href="activity/266/messlog/page" class="p4">短信日志</a> <a href="activity/266/demo" 1667 class="p4" target="_blank">页面</a> 1668 </td> 1669 </tr> 1670 <tr class=""> 1671 <td class=" activity_end "> 1672 265 1673 </td> 1674 <td class=" activity_end "> 1675 结婚采购第二季--艾薇 1676 </td> 1677 <td> 1678 是(type1) 1679 </td> 1680 <td> 1681 <a href="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" title="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" 1682 target="_black">查看</a> 1683 </td> 1684 <td> 1685 <span class="start_time" time="1361151956" title="2013-02-18 09:45:56"></span> 1686 </td> 1687 <td> 1688 <span class="end_time" time="1362585356" title="2013-03-06 23:55:56"></span> 1689 </td> 1690 <td> 1691 <div class="show_info"> 1692 <div> 1693 <a href="activity/265/user/list" class="p4">用户</a> 1694 </div> 1695 <ul class="info_detail" isload="no" act_id="265"> 1696 </ul> 1697 </div> 1698 <a href="activity/265/edit/page" class="p4">编辑</a> <a href="activity/265/setting/page" 1699 class="p4">设置</a> <a href="activity/265/messlog/page" class="p4">短信日志</a> <a href="activity/265/demo" 1700 class="p4" target="_blank">页面</a> 1701 </td> 1702 </tr> 1703 <tr class="alt-row"> 1704 <td class=" activity_end "> 1705 264 1706 </td> 1707 <td class=" activity_end "> 1708 结婚采购第二季--影匠 1709 </td> 1710 <td> 1711 是(type1) 1712 </td> 1713 <td> 1714 <a href="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" title="http://cd.qq.com/zt2013/D2JJHCGJ/index.htm" 1715 target="_black">查看</a> 1716 </td> 1717 <td> 1718 <span class="start_time" time="1361151839" title="2013-02-18 09:43:59"></span> 1719 </td> 1720 <td> 1721 <span class="end_time" time="1362585359" title="2013-03-06 23:55:59"></span> 1722 </td> 1723 <td> 1724 <div class="show_info"> 1725 <div> 1726 <a href="activity/264/user/list" class="p4">用户</a> 1727 </div> 1728 <ul class="info_detail" isload="no" act_id="264"> 1729 </ul> 1730 </div> 1731 <a href="activity/264/edit/page" class="p4">编辑</a> <a href="activity/264/setting/page" 1732 class="p4">设置</a> <a href="activity/264/messlog/page" class="p4">短信日志</a> <a href="activity/264/demo" 1733 class="p4" target="_blank">页面</a> 1734 </td> 1735 </tr> 1736 </table> 1737 </body> 1738 </html>
2 完整插件代码：
View Code
1 /// <reference path="http://www.cnblogs.com/jquery-1.7.1.min.js" /> 2 3 var DropList = function (opts) { 4 if (!opts.id) { 5 alert('请指定触发展开事件的元素id'); 6 return false; 7 } 8 //触发展开元素id 9 this.toggleId = opts.id; 10 this.toggleEl = opts.id ? $('#' + opts.id) : $('body'); 11 this.key = opts.id ? opts.id + '_list' : new Date().getTime(); 12 this.open = opts.open || 'click'; //展开菜单方式 mousein 13 this.close = opts.close || 'click'; //关闭菜单方式 mouseleave 14 15 //this.initShow = false; //判断是否初始化出现菜单绑定事件 16 17 /*下拉菜单数据，可能出现多级菜单数据格式： 18 [['v', 'k', []], ['v', {}, []], 19 ['v', 'k', [['v', 'k', []], ['v', 'k', []]] 20 ] 21 */ 22 this.dropItems = opts.dropItems || null; 23 this.loadData = opts.loadData; //用于异步加载下拉菜单数据//具有层级关系 24 this.listEl = null; 25 this.func = opts.func || null; //点击时的事件处理 26 this.asyncDataLoad = opts.asyncDataLoad; //用于异步数据加载 27 28 //同步方式加载 29 if (this.dropItems) { 30 this.initDropItems(); 31 this.eventBind(); 32 } else { 33 if (this.asyncDataLoad && typeof this.asyncDataLoad == 'function') { 34 var scope = this; 35 scope.toggleEl.mousemove(function () { 36 var el = $(this); 37 scope.toggleEl.unbind('mousemove'); 38 var o = scope.asyncDataLoad.call(scope, el); 39 //此处需要做严格格式检查 40 var url = o.url; 41 var p = o.param; 42 var getDropItem = o.getDropItem; 43 44 $.get(url, p, function (data) { 45 scope.dropItems = getDropItem(data); 46 scope.initDropItems(); 47 scope.eventBind(); 48 if(scope.open != 'click') 49 scope.toggleEl.mouseenter(); 50 }); 51 var s = ''; 52 }); 53 } 54 } 55 }; 56 57 DropList.prototype.closeList = {}; 58 59 DropList.prototype.dropItemLoad = function (data, el) { 60 for (var i in data) { 61 var item = data[i]; 62 var tmp = $('<li></li>'); 63 el.append(tmp); //标签已装载 64 if (item[0]) { 65 tmp.html(item[0]); 66 } 67 if (item[1] || typeof item[1] == 'number') { 68 if (typeof item[1] == 'string' || typeof item[1] == 'number') { 69 tmp.attr('id', item[1]); 70 } else { 71 for (_k in item[1]) { 72 tmp.attr(_k, item[1][_k]); 73 } 74 } 75 } 76 if (item[2] && item[2]['length']) {//此处需要递归 77 var child = $('<ul></ul>') 78 tmp.append(child); 79 tmp.addClass('parent_drop_list'); 80 this.dropItemLoad(item[2], child); 81 } 82 } 83 }; 84 85 //['v', 'k', []] 86 DropList.prototype.initDropItems = function () { 87 var scope = this; 88 var dropItems = scope.dropItems; 89 var listEl = $('<ul class="drop_list_items" id="' + scope.key + '"></ul>'); 90 $('body').append(listEl); 91 scope.dropItemLoad(dropItems, listEl); 92 scope.listEl = listEl; 93 }; 94 95 DropList.prototype.closeList = function () { 96 var listEl = this.listEl; 97 listEl.find('li').removeClass('cur_active'); 98 listEl.find('ul').hide(); 99 listEl.hide(); 100 }; 101 102 DropList.prototype.eventBind = function () { 103 var scope = this; 104 var listEl = scope.listEl; 105 var toggleEl = scope.toggleEl; 106 var open = scope.open; 107 var close = scope.close; 108 var func = scope.func; 109 110 var obj_len = function (o) { 111 var len = 0; 112 for (var k in o) { 113 len++; 114 } 115 return len; 116 }; 117 118 var func_cls = function () { 119 if (close == 'click') { 120 $(document).click(function (e) { 121 var el = $(e.target); 122 var is_el = false; 123 //判断父元素是否为 124 while (el.attr('id') != scope.key) { 125 if (el.is("ul") || el.is('li')) { 126 is_el = true; 127 el = el.parent(); 128 } else { 129 break; 130 } 131 } 132 if (el.attr('id') == scope.toggleId) { 133 is_el = true; 134 } 135 if (!is_el) { 136 scope.closeList(); 137 if (scope.closeList[scope.toggleId]) 138 delete scope.closeList[scope.toggleId]; 139 if (obj_len(scope.closeList) == 0) 140 $(document).unbind('click'); 141 var s = ''; 142 } 143 }); 144 } else { 145 var toggleOut = null; 146 var m_out = function () { 147 scope.closeList(); 148 if (scope.closeList[scope.toggleId]) 149 delete scope.closeList[scope.toggleId]; 150 toggleEl.unbind('mouseleave'); 151 listEl.unbind('mouseleave'); 152 }; 153 toggleEl.mouseleave(function (e) { 154 toggleOut = setTimeout(function () { 155 m_out(); 156 }, 500); 157 }); 158 listEl.unbind('mouseenter').mouseenter(function () { 159 if (toggleOut) 160 clearTimeout(toggleOut); 161 listEl.mouseleave(function (e) { 162 m_out(); 163 }); 164 }); 165 } 166 }; 167 168 //确认弹出层位置 169 var func_init_pos = function (el) { 170 var offset = el.offset(); 171 var h = parseInt(el.height()); 172 var p_top = parseInt(el.css('padding-top')); 173 var p_bottom = parseInt(el.css('padding-bottom')); 174 var _top = parseInt(offset.top) + h + p_top + p_bottom; 175 var w_h = $(window).height() || $(document).height(); //当前窗口高度 176 var el_h = listEl.height() + parseInt(listEl.css('padding-top')) + parseInt(listEl.css('padding-bottom')); //当前浮动层高度 177 var s_t = parseInt($(document).scrollTop()); //滚动条高度 178 179 //若是当前top + 层高度 > 窗口高度的话，便予以特殊处理 180 if (el_h + _top > w_h + s_t) { 181 listEl.css('top', (_top - el_h - h) + 'px'); 182 } else { 183 listEl.css('top', (_top) + 'px'); 184 } 185 186 listEl.css('min-width', (parseInt(el.css('width')) + parseInt(el.css('padding-left')) + parseInt(el.css('padding-right')) - 6) + 'px') 187 listEl.css('left', parseInt(offset.left) + 'px'); 188 }; 189 190 var show_drop_list = function (el) { 191 var drop_list_items = $('.drop_list_items'); 192 func_init_pos(el); 193 drop_list_items.removeClass('z800'); 194 listEl.addClass('z800'); 195 listEl.show(); 196 func_cls(); 197 }; 198 199 if (open == 'click') { 200 toggleEl.unbind('click').click(function (e) { 201 var el = $(this); 202 show_drop_list(el); 203 scope.closeList[scope.toggleId] = 1; 204 //e.stopPropagation(); //阻止冒泡 205 }); 206 } else { 207 toggleEl.unbind('mouseenter').mouseenter(function (e) { 208 var el = $(this); 209 show_drop_list(el); 210 //e.stopPropagation(); //阻止冒泡 211 }); 212 } 213 214 listEl.delegate('li', 'mouseenter', function (e) { 215 var el = $(this); 216 listEl.find('li').removeClass('cur_active'); 217 listEl.find('ul').hide(); 218 el.addClass('cur_active'); 219 el.children().show(); 220 221 el = el.parent(); 222 while (el.attr('id') != scope.key) { 223 if (el.is("li")) { 224 el.addClass('cur_active'); 225 } 226 if (el.is('ul')) { 227 el.show(); 228 } 229 el = el.parent(); 230 } 231 e.stopPropagation(); 232 }); 233 234 if (func && typeof func == 'function') { 235 listEl.delegate('li', 'click', function (e) { 236 func.call(this, e, scope, listEl, toggleEl); 237 e.stopPropagation(); //不阻止冒泡在每个节点都将执行事件 238 }); 239 } 240 }; 241 242 243 function initNewDrop(opts) { 244 if (opts.klass) { 245 $('.' + opts.klass).each(function (k, v) { 246 var el = $(this); 247 var id = new Date().getTime() + '_' + k; 248 if (el.attr('id')) { 249 id = el.attr('id'); 250 } else { 251 el.attr('id', id); 252 } 253 opts.id = id; 254 new DropList(opts); 255 }); 256 } else { 257 new DropList(opts); 258 } 259 }
前端关键代码：
1 asyncDataLoad: function (el) { 2 //el为鼠标滑动元素 3 var asyncObj = {}; 4 asyncObj.url = 'Handler.ashx'; 5 asyncObj.param = { 'act_id': el.find('ul').attr('act_id') }; 6 asyncObj.getDropItem = function (data) { 7 //data为异步请求获取后的数据 8 if (data && typeof data == 'string') { 9 data = eval('(' + data + ')'); 10 } 11 data = data.data; 12 var type = data.notice; 13 if (type == 0) { 14 msg = '不发送短信'; 15 } else if (type == 1) { 16 msg = '自动短信'; 17 } else if (type == 3) { 18 msg = '手动短信'; 19 } 20 var param = [ 21 ['活动id：' + data.act_id], 22 ['报名人数：' + data.reg_num], 23 ['短信类型：' + msg], 24 ['<a href="#">自动短信条数：' + data.sms_auto_count + '</a>'], 25 ['<a href="http://www.baidu.com/" target="_blank">手动短信条数：' + data.sms_manual_count] 26 ]; 27 return param; 28 }; 29 return asyncObj; 30 },
这里通过该函数（先定义好），可操作鼠标滑过的元素他需要完成以下事情：
1 给出异步数据拉取url
2 给出需要的参数
3 给出数据拉取成功后调用的函数，该函数需要返回dropitem 二维数组格式，以生成下拉菜单；
插件关键代码：
1 //同步方式加载 2 if (this.dropItems) { 3 this.initDropItems(); 4 this.eventBind(); 5 } else { 6 if (this.asyncDataLoad && typeof this.asyncDataLoad == 'function') { 7 var scope = this; 8 scope.toggleEl.mousemove(function () { 9 var el = $(this); 10 scope.toggleEl.unbind('mousemove'); 11 var o = scope.asyncDataLoad.call(scope, el); 12 //此处需要做严格格式检查 13 var url = o.url; 14 var p = o.param; 15 var getDropItem = o.getDropItem; 16 17 $.get(url, p, function (data) { 18 scope.dropItems = getDropItem(data); 19 scope.initDropItems(); 20 scope.eventBind(); 21 if(scope.open != 'click') 22 scope.toggleEl.mouseenter(); 23 }); 24 var s = ''; 25 }); 26 } 27 }
注意17、8行，当数据获取成功后给我们的dropItem是赋值，然后继续原流程
后记
这次暂时如此吧，老大一会又在后面走一下，我心里害怕。。。。。。
