PHP API接口必備之輸出json格式數據示例代碼
791
2023-12-08
對話框（Dialog）是一個特殊的窗口（window），可以包含在頂部的工具欄和在底部的按鈕。默認情況下，對話框（Dialog）不能改變大小，但是用戶可以設置 resizable 屬性為 true，使其可以改變大小。
這種就是對話框了。
EasyUI有兩種創建方式：
第一種：通過已存在的DOM節點元素標簽創建
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無標題文檔</title> < 導入js文件 --> < 導入jquery核心js文件 --> <script type="text/javascript" src="http://www.gimoo.net/t/1901/jquery.min.js"></script> < 導入easyui核心js文件 --> <script type="text/javascript" src="http://www.gimoo.net/t/1901/jquery.easyui.min.js"></script> < 導入本地語言的js文件--> <script type="text/javascript" src="http://www.gimoo.net/t/1901/locale/easyui-lang-zh_CN.js"></script> < 導入css --> < 導入easyui的默認css文件--> <link type="text/css" rel="stylesheet" /> < 導入圖標的css文件 --> <link type="text/css" rel="stylesheet" /> </head> <body> <div id="dd" class="easyui-dialog" title="我的對話框" style="width:400px;height:200px;" data-options="iconCls:'icon-save',resizable:true,modal:true"> 提示內容 </div> </body> </html>
第二種：通過js動態創建對話框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
< 導入js文件 -->
< 導入jquery核心js文件 -->
<script type="text/javascript" src="http://www.gimoo.net/t/1901/jquery.min.js"></script>
< 導入easyui核心js文件 -->
<script type="text/javascript" src="http://www.gimoo.net/t/1901/jquery.easyui.min.js"></script>
< 導入本地語言的js文件-->
<script type="text/javascript" src="http://www.gimoo.net/t/1901/locale/easyui-lang-zh_CN.js"></script>
< 導入css -->
< 導入easyui的默認css文件-->
<link type="text/css" rel="stylesheet" />
< 導入圖標的css文件 -->
<link type="text/css" rel="stylesheet" />
</head>
<body>
<<div id="dd" class="easyui-dialog" title="我的對話框" style="width:400px;height:200px;" data-options="iconCls:'icon-save',resizable:true,modal:true">
提示內容
</div> -->
<div id="dd">對話框內容</div>
<script type="text/javascript">
$("#dd").dialog({
title: '我的對話框', //標題
collapsible:true, //是否可折疊
minimizable:true, //最小化按鈕
maximizable:true,//最大化按鈕
resizable:true,//是否改變窗口大小
width: 400,
height: 200,
closed: false,
cache: false,
href: 'beautiful.html',
});
</script>
</body>
</html>
以上所述是小編給大家介紹的EasyUI創建對話框的兩種方式，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對綠夏網網站的支持！
