jquery esay ui学习
来源:互联网 发布:网络销售需要什么条件 编辑:程序博客网 时间:2024/06/05 20:15
1.jquery框架自带了一个框架,直接有利于后台开发,下载最新版的jquery esay ui使用引用jshe css
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>EsayUI</title> <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.3/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.3/themes/icon.css"> <script type="text/javascript" src="jquery-easyui-1.4.3/jquery.min.js"></script> <script type="text/javascript" src="jquery-easyui-1.4.3/jquery.easyui.min.js"></script> <script type="text/javascript"> $(function(){ bindevent(); }); function bindevent() { $('.menuitem').click(function(){ var title=$(this).text(); //jquery esy ui中tabs带的判断方法,判断该tab项是否存在用,title来判断 var isExt=$('#tt').tabs('exists',title); //给tab页添加上标签 if(isExt) { <span style="font-size:18px;"></span><pre name="code" class="html"> //jquery esy ui选中该tab,title参数$('#tt').tabs('select',title);
return;
}
$('#tt').tabs('add',{
title: $(this).text(),
content: ShowContent($(this).data('url')),
closable: true
});
});
}
function ShowContent(url)
{
var strhtml='<iframe src="'+url+'" border="no" scrolling="no" height="100%" width="100%" frameborder="0"></iframe>';
alert(strhtml);
return strhtml;
}
</script>
</head>
<body class="easyui-layout">
<div data-options="region:'north',border:false" style="height:60px;background:#B3DFDA;padding:10px">标题</div>
<div data-options="region:'west',split:true,title:'菜单栏'" style="width:150px;padding:0px;">
<div class="easyui-accordion" style="width:100%;height:100%">
<div title="新闻管理" data-options="iconCls:'icon-no'" style="overflow:auto;padding:0px;">
<ul>
<li>
<a href="javascript:void(0);" class="menuitem">新闻管理1</a>
<ul>
<li>
<a href="javascript:void(0);" class="menuitem" data-url="ttt.html">新闻管理11</a>
</li>
<li>
<a href="javascript:void(0);" class="menuitem">新闻管理12</a>
</li>
</ul>
</li>
<li>
<a href="javascript:void(0);" class="menuitem">新闻管理2</a>
</li>
<li>
<a href="javascript:void(0);" class="menuitem">新闻管理3</a>
</li>
</ul>
</div>
<div title="评论管理" data-options="iconCls:'icon-help'" style="padding:10px;">
<p>第二个菜单</p>
</div>
</div>
</div>
<!-- <div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>
-->
<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">底部</div>
<div data-options="region:'center',title:'首页'">
<div id="tt" class="easyui-tabs" data-options="tools:'#tab-tools'" style="width:700px;height:250px" fit="true"></div>
</div>
</body>
</html>
0 0
- jquery esay ui学习
- Jquery esay ui datagrid formatter属性简单使用
- esay UI实现无限级tree
- esay ui datagrid动态生成列
- esay UI datagrid 行点击 编辑 出现 保存跟取消
- Esay UI Input控件类型取值赋值
- jquery UI学习
- jquery UI 学习
- jquery UI draggable学习
- Jquery UI draggable学习
- jQuery-UI学习dialog
- jQuery-UI学习dialog_form
- jQuery-UI学习tabs
- jQuery UI 学习笔记
- jquery-ui学习笔记
- jQuery与jQuery ui学习
- jQuery 学习笔记 + jQuery-UI 学习笔记
- jquery easy ui 学习资料
- Navicat for MySQL新建远程用户问题
- Intent和IntentFilter详解
- JDK, JRE 和JVM的区别
- 用Intent调用系统中经常被用到的组件
- Java 大作业回忆--day01--PPT Controller
- jquery esay ui学习
- 06 maven问题 "Could not calculate build plan: Plugin 'jarPrefix':'jarName':'jarVersion' "
- kindeditor屏蔽网络图片
- String使用经验
- TS科普17 有条件访问表
- [Python3.4] 从HTTP代理网站批量获取代理并筛选
- Android是否联网判断
- 网上文库文档免费下载
- 宽度为100%的位图面对屏幕放大的解决办法(可拼接时)