您的位置：首页 > 产品设计 > UI/UE

每天学一点easyui①

2015-11-13 20:58 477 查看
引入js和css文件

<script type="text/javascript" src="js/jquery-easyui-1.4.3/jquery.min.js"></script>

<script type="text/javascript" src="js/jquery-easyui-1.4.3/jquery.easyui.min.js" charset="UTF-8"></script>

<link rel="stylesheet" href="js/jquery-easyui-1.4.3/themes/default/easyui.css" />

<link rel="stylesheet" href="js/jquery-easyui-1.4.3/themes/icon.css" />

<script type="text/javascript" src="js/jquery-easyui-1.4.3/locale/easyui-lang-zh_CN.js"></script>

在页面输入一个div

<body>

<div id="p" style="width:500px;height:200px;padding:10px;" </div>

</body>

添加一段js

<script type="text/javascript">

$(function() {

$('#p').dialog({

modal: true//

});

});

</script>

注意：modal: false//设置背景是否可以编辑 true不可以选择 false 可以选择

Panel

面板带图标的



<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title></title>

<script type="text/javascript" src="js/jquery-easyui-1.4.3/jquery.min.js"></script>

<script type="text/javascript" src="js/jquery-easyui-1.4.3/jquery.easyui.min.js" charset="UTF-8"></script>

<link rel="stylesheet" href="js/jquery-easyui-1.4.3/themes/default/easyui.css" />

<link rel="stylesheet" href="js/jquery-easyui-1.4.3/themes/icon.css" />

<script type="text/javascript" src="js/jquery-easyui-1.4.3/locale/easyui-lang-zh_CN.js"></script>

<script type="text/javascript">

</script>

</head>

<body>

11111111111

<!--<div id="p" title="1234512345" style="width:500px;height:200px;padding:10px;" </div>-->

<div id="p" class="easyui-panel" title="My Panel"

style="width:500px;height:150px;padding:10px;background:#fafafa;"

data-options="closed:true">

<p>panel content.</p>

<p>panel content.</p>

</div>

<!--单击open按钮显示这个panel-->

<input type="button" value="open" onclick="$('#p').panel('open')" />

<!--单击close按钮关闭panel 在内存中仍然存在-->

<input type="button" value="close" onclick="$('#p').panel('close')" />

<!--销毁这个panel-->

<input type="button" value="destroy" onclick="$('#p').panel('destroy')" />

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航