一、说明
前面实现了关键词订阅模块,现在实现站点订阅模块,主要实现的是站点添加界面。站点添加界面里面实现一个提示框不在提示的功能(保存到cookie中),还有就是实现一个站点的选择框,包括输入文字自动筛选的功能。如下效果图:
二、提示框的实现
先把添加的界面整体实现了,就是一个DIV中放了一个表格,表格有一行两列,分别是<td><table></table>(第一列放的是客户ID,状态.....)</td> <td>DIV</td>(第二列放的是一个DIV提示框)。还有就是像顶部的标题,还有标签卡。这些前面都已经说过了,就不再细说。
JSP
1 <body> 2 <form id="adduserform" action="<%=basePath%>site/siteAdd" method="post"> 3 <div class="jc-demo-box"> 4 <div class="divHeader"> 5 <h1 class="headerH1">全媒体订阅</h1> 6 <div class="f_r"> 7 <p> 8 欢迎您:<span class="color2">中科大洋</span> 上次登录时间:2小时前 9 </p> 10 </div> 11 </div> 12 <div class="divTab"> 13 <a class="tabSet " name="typeAdd" href="key/listAllKeys">关键词订阅</a> 14 <a class="tabSet tabin" name="keyAdd" href="site/siteList">网站论坛订阅</a> 15 <a class="tabSet" name="keyAdd" href="weibo/weiboList">微博账号订阅</a> 16 <a class="tabSet" name="keyAdd" href="weixin/weixinList">微信账号订阅</a> 17 <a class="addOther" href="javascript:history.go(-1);">返回上一级</a> 18 </div> 19 <div class="divContent"> 20 <div class="divTab"> 21 <div id="keyadd" class="keyaddClass"> 22 <a class="tabin clickA" rela="keyword_set" name="keyMessage" href="javascript:;">添加站点</a> 23 <a class="clickA" rela="keyword_set" name="keyMessage" href="site/siteList" style="float: right">返回URL列表</a> 24 <p class="clr"></p> 25 </div> 26 </div> 27 <div class="divExample"> 28 <table align="left"> 29 <tr> 30 <td > 31 <div class="divContent1" style="margin-left: 10px;"> 32 <table align="left" id="addTable"> 33 <tr> 34 <td > 35 <label title="1">客 户 ID:</label> 36 </td> 37 <td colspan="2"> 38 <input type="text" name="client_id"> 39 </td> 40 </tr> 41 <tr> 42 <td > 43 <label title="1">状 态:</label> 44 </td> 45 <td colspan="2"> 46 <input type="radio" name="status" value="1" id="5"><label for="5">启用</label> 47 <input type="radio" name="status" value="-1" id="6"><label for="6">禁用</label> 48 </td> 49 </tr> 50 <tr> 51 <td > 52 <label title="1">开始时间:</label> 53 </td> 54 <td colspan="2"> 55 <input type="text" name="start_time" onClick="WdatePicker()"><br> 56 </td> 57 </tr> 58 59 <tr> 60 <td > 61 <label title="1">结束时间:</label> 62 </td> 63 <td colspan="2"> 64 <input type="text" name="end_time" onClick="WdatePicker()"> 65 </td> 66 </tr> 67 <tr> 68 <td > 69 <label title="1">站 点 1:</label> 70 </td> 71 <td> 72 <input type="text" name="site" onblur="" id="siteThis"> 73 <label id="lsite"></label> 74 </td> 75 <td> 76 <img alt="添加" src="images/yq/site/newSite.jpg" onclick="IndustrySelect_3()"> 77 </td> 78 </tr> 79 <tr> 80 <td> 81 <input type="button" value="添加" id="enterImg" > 82 </td> 83 <td></td><td></td> 84 </tr> 85 </table> 86 </div> 87 </td> 88 <td> 89 <div class="divTip" style=" width: 377px;margin-top: -50px"> 90 <img alt="" src="images/yq/site/hander.jpg" width="20px" height="20px"> 91 <div class="pTip"> 92 <img alt="不再提醒" src="images/yq/site/noTip.jpg" title="不再提醒" id="cancleTip"> 93 <p>1.至少选择一个站点</p> 94 <p>2.也可以点击下面的常用站点进行站点的添加</p> 95 <p>3.格式: 大洋 http://www.dayang.com.cn</p> 96 <p>4.红色X按钮,关闭提示框,不再显示</p> 97 </div> 98 </div> 99 </td> 100 </tr> 101 </table> 102 </div> 103 </div> 104 <div style="clear:both;height:1px;width:100%; overflow:hidden; margin-top:-1px;"></div> 105 </div> 106 <div id="maskLayer" style="display:none"> 107 <iframe id="maskLayer_iframe" frameBorder=0 scrolling=no style="filter:alpha(opacity=50)"></iframe> 108 <div id="alphadiv" style="filter:alpha(opacity=50);-moz-opacity:0.5;opacity:0.5"></div> 109 <div id="drag"> 110 <h3 id="drag_h"></h3> 111 <div id="drag_con"></div><!-- drag_con end --> 112 </div> 113 </div><!-- maskLayer end --> 114 </form> 115 116 </body>