jquery生成二级菜单的实例代码

发布时间:2020-11-01编辑:脚本学堂
jquery生成二级菜单的实例代码,如何用jquery实现二级菜单导航效果,有需要的朋友做个参考。

1,javascript 页面中的函数
 

复制代码 代码示例:
function querySub(id,sid/*选中的项*/){
$.post('${path}/page/article/querySubChannelArticle.action',
  {'channelId':id},function(data){
  $('select[name="article.subChannel.subId"] option[value!=""]').remove();
  var jsonObj = data;   
  for ( var i = 0; i < jsonObj.length; i++) {
      var $option = $('<option>');
      $option.attr('value',jsonObj[i].subId);
      if(jsonObj[i].subId === sid){
   $option.attr('selected',true);
      }
      $option.text(jsonObj[i].subName);
      $('select[name="article.subChannel.subId"]').append($option);
  }
 });
}
$(function(){
 querySub(<s:property value='article.subChannel.channel.channelId'/>,<s:property value='article.subChannel.subId'/>);
});
 

页面代码:
 

复制代码 代码示例:
<tr>
  <th>一级栏目</th>
   <td valign="middle">
  <s:select id='_channel' list="channelList" listKey="channelId"
  listValue="channelName" 
    key="article.subChannel.channel.channelId"
    onchange="querySub(this.value)"></s:select>
</td>
</tr>
<tr>
  <th>二级栏目</th>
 <td valign="middle">
 <s:select name='article.subChannel.subId' list="{}" headerKey="" headerValue="-请选择-"></s:select>
 <!--<s:property value="article.subChannel.subName"/>
 --></td>
</tr>

服务器
 

复制代码 代码示例:

public String querySubChannelArticle(){ 
HttpServletResponse response=getResponse();
HttpServletRequest request=getRequest();
 response.setContentType("application/json; charset=UTF-8");
 PrintWriter out =null;
 try {
     out = response.getWriter();

     List<Map<String,Object>> list = new LinkedList<Map<String,Object>>();
     if(channelId!=null && !channelId.equals("")){
  Channel tmp = new Channel();
  tmp.setChannelId(Integer.parseInt(channelId));
  subChannelList = subChannelDAO.listSubChannel(tmp);

  for(Object oo:subChannelList){
  Map<String,Object> obj = new HashMap<String,Object>();
  SubChannel c = (SubChannel)oo;
  obj.put("subId", c.getSubId());
  obj.put("subName", c.getSubName());
  list.add(obj);
  }
     }
     String outStr = JsonUtil.toJSONStr(list);
     out.println(outStr);
 }catch(Exception e){
 e.printStackTrace();
 }
 out.flush();
 out.close();
 return null;
}