项目中的一个展开隐藏回复的功能

客户的不断变更是我提高技术的动力！
实现了一个浏览回复帖的功能，回复的信息也可以回复，只要在servlet给他返回html代码了，幸好不是太麻烦。
首先是页面部分，包括了很多struts标签
[code]<div class="left_box">
<logic:empty name="infoBean" property="infoList">
对不起，没有您想要的记录！
</logic:empty>
<logic:iterate id="info" name="infoBean" property="infoList">
<fieldset>
<table cellspacing="1" width="100%" border="1">
<tr>
<td rowspan="4" width="70">
<logic:match name="info" property="tpye" value="A">
货源信息
</logic:match>
<logic:match name="info" property="tpye" value="B">
车源信息
</logic:match>
<logic:match name="info" property="tpye" value="C">
其它信息
</logic:match>
<br/>
<img id="<bean:write name='info' property='lnid'/>" src="images/plus.gif" onClick="openList(this.id);"/>信息号<bean:write name="info" property="lnid"/><br/>
<a href="../front/infoReplayForm.shtml?pnid=<bean:write name='info' property='lnid'/>">留言</a>
</td>
<td rowspan="2" width="500" valign="top">
<bean:write name="info" property="sdty"/> 
<bean:write name="info" property="nmbr"/><bean:write name="info" property="uom"/> 
有效天数:<bean:write name="info" property="dkco"/>  
<bean:write name="info" property="dsc"/>
</td>
<td width="80">发布公司：</td>
<td><bean:write name="info" property="dkco"/> </td>
</tr>
<tr>
<td>发布人：</td>
<td><bean:write name="info" property="bcusr"/> </td>
</tr>
<tr>
<td>起始地：<bean:write name="info" property="adss"/>  <bean:write name="info" property="adssn"/></td>
<td>联系方式：</td>
<td><bean:write name="info" property="rltv"/> </td>
</tr>
<tr>
<td>终止地：<bean:write name="info" property="adse"/>  <bean:write name="info" property="adsen"/></td>
<td>发布时间：</td>
<td><bean:write name="info" property="bcdat" format="yyyy-MM-dd"/> </td>
</tr>
<tbody id="s<bean:write name='info' property='lnid'/>"></tbody>
</table>
</fieldset>
</logic:iterate>
<logic:notEmpty name="infoBean" property="infoList">
<fieldset>
<table cellspacing="1" width="100%">
<tr><td><cochang:paginate name="infoBean" list="infoList"/></td></tr>
</table>
</fieldset>
</logic:notEmpty>
</div>
[/code]

然后是javascript部分，比较简单，一是需要把加号替换一下，再就是请求servlet返回html代码填充到tbody中

[code]function openList(id) {
var image = document.getElementById(id);
var imagesrc = image.src;
if(imagesrc.indexOf("plus")>0){
image.src="images/nofollow.gif";
var params = "id=" + id;
var url = '../fore/infoServlet';
var myAjax = new Ajax.Updater('s'+id, url, {method: 'get', parameters: params});
}else if(imagesrc.indexOf("nofollow")>0){
image.src="images/plus.gif";
$('s'+id).innerText="";
}
}[/code]
下面是servlet部分，一口气代码全部贴上。
[code]public class InfoServlet extends BaseAjaxServlet {

InfoService infoService;

public void init() throws ServletException {
super.init();
this.infoService = (InfoService)CustomBeanFactory.getBean("infoService");
}

public String performTask(HttpServletRequest request, HttpServletResponse response) {
String id = request.getParameter("id");
String result = " 可能发生错误，请与管理员联系！";
if(!id.equalsIgnoreCase("")){
result = searchInfo(id);
}

return result;
}

public String searchInfo(String id) {
List infos = infoService.searchByPnid(id);
Info info = new Info();
StringBuffer string = new StringBuffer(200);
if(infos.size() == 0) {
return " 没有任何留言!";
}
string.append(" ");
for(int i=0;i<infos.size();i++) {
info = (Info)infos.get(i);
string.append("<tr><td><img id='"+info.getLnid()+"' src='images/plus.gif' onClick='openList(this.id);'/><a href='../front/infoReplayForm.shtml?pnid="+info.getLnid()+"'>留言</a></td><td>");
string.append(info.getLnid());
string.append("</td><td>");
string.append(info.getDsc());
string.append("</td></tr><tbody id='s"+info.getLnid()+"'></tbody></td></tr>");
}
string.append("</table></td></tr>");
return string.toString();
}
}[/code]
最后还是一个效果图，视觉才是最直观的。