前几天学了Jquery easyui 现在不知道 怎么实现table的跳转 就是点左边的菜单按钮,中间部分自动跳转到相应的页面 求大神指导
我刚做了一个项目,
$(document).ready(function(){ //注销登录 $("#logout").click(function(){ adminService.logout(); }) //提交 $("#save").click(function(){ oldPassword=$("#oldPassword").val(); newPassword=$("#newPassword").val(); newPasswordAgain=$("#newPasswordAgain").val(); if(newPasswordAgain!=newPassword){ $.messager.alert("错误","两次密码输入不一致,修改失败","error"); }else{ adminService.changePassword(oldPassword,newPassword,function(data){ if(data){ $.messager.alert("提示","密码修改成功","info"); $("#fm-cp").form("clear"); $("#dlg-cp").dialog('close'); } else{ $.messager.alert("错误","原密码错误,修改失败","error"); } }); } }) //重置 $("#reset").click(function(){ $("#fm-cp").form("clear"); }) //修改密码对话框 $("#changePassword").click(function(){ $("#dlg-cp").dialog('open').dialog("setTitle","修改密码"); $("#fm-cp").form("clear"); }) // 数据 var treeData=[{ text:"基本信息管理", state:"open", iconCls:"icon-menu", children:[{ text:"商品管理", iconCls:"icon-goods", attributes:{ url:"jsp/GoodsManager.jsp" } },{ text:"供应商管理", iconCls:"icon-provider", attributes:{ url:"jsp/ProviderManager.jsp" } },{ text:"员工管理", iconCls:"icon-employee", attributes:{ url:"jsp/EmployeeManager.jsp" } }] },{ text:"出入库管理", state:"open", iconCls:"icon-pencil", children:[{ text:"商品入库", iconCls:"icon-instore", attributes:{ url:"jsp/InGoods.jsp" } },{ text:"商品售出", iconCls:"icon-outstore", attributes:{ url:"jsp/OutGoods.jsp" } },{ text:"库存查询", iconCls:"icon-zoom", attributes:{ url:"jsp/Stock.jsp" } }] },{ text:"查询统计", state:"open", iconCls:"icon-chart", children:[{ text:"流水账查询", iconCls:"icon-daybook", attributes:{ url:"jsp/DayBookQuery.jsp" } },{ text:"收支统计", iconCls:"icon-account", attributes:{ url:"jsp/AccountStatistics.jsp" } },{ text:"商品销售统计", iconCls:"icon-sell", attributes:{ url:"jsp/SellStatistics.jsp" } }] },{ text:"售后服务", state:"open", iconCls:"icon-girl", children:[{ text:"维修记录", iconCls:"icon-repair", attributes:{ url:"jsp/RepairRecords.jsp" } }] }]; // 实例化树菜单 $("#tree").tree({ data:treeData, lines:true, onClick:function(node){ if(node.attributes){ openTab(node.text,node.attributes.url); } } }); $('#tabs').tabs({ onSelect: function(title){ if(title=="库存查询"){ $("#库存查询").attr('src','jsp/Stock.jsp'); } if(title=="流水账查询"){ $("#流水账查询").attr('src','jsp/DayBookQuery.jsp'); } if(title=="收支统计"){ $("#收支统计").attr('src','jsp/AccountStatistics.jsp'); } if(title=="商品销售统计"){ $("#商品销售统计").attr('src','jsp/SellStatistics.jsp'); } } }); // 新增Tab function openTab(text,url){ if($("#tabs").tabs('exists',text)){ $("#tabs").tabs('select',text); }else{ var content="<iframe id="+text+" frameborder='0' scrolling='auto' style='width:100%;height:100%' src="+url+"></iframe>"; $("#tabs").tabs('add',{ title:text, closable:true, content:content }); } } });
easyui 布局里,很多控件 有 href或者 url属性, 如 tab,panel、windows....,点击菜单 改变 这些控件的 url属性即可。
对呀,多看demo
function selTab(id) {
var info = $("#readInfo");
info.tabs('select', id);
}