Commit ab2872c1 authored by 季圣华's avatar 季圣华
Browse files

升级easyUI到1.9.4版本

parent 0527b980
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>Group DataList - jQuery EasyUI Mobile Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/mobile.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.mobile.js"></script> </head><body> <div class="easyui-navpanel"> <header> <div class="m-toolbar"> <span class="m-title">Group DataList</span> </div> </header> <div id="dl" data-options=" fit: true, border: false, lines: true "> </div> </div> <div id="p2" class="easyui-navpanel"> <header> <div class="m-toolbar"> <span id="p2-title" class="m-title">Detail</span> <div class="m-left"> <a href="javascript:void(0)" class="easyui-linkbutton m-back" plain="true" outline="true" onclick="$.mobile.back()">Back</a> </div> </div> </header> <div style="margin:50px 0 0;text-align:center"> <a href="javascript:void(0)" class="easyui-linkbutton" style="width:100px;height:30px" onclick="$.mobile.back()">Go Back</a> </div> </div> <script> var data = [ {"group":"FL-DSH-01","item":"Tailless"}, {"group":"FL-DSH-01","item":"With tail"}, {"group":"FL-DSH-02","item":"Adult Female"}, {"group":"FL-DSH-02","item":"Adult Male"} ]; $(function(){ $('#dl').datalist({ data: data, textField: 'item', groupField: 'group', textFormatter: function(value){ return '<a href="javascript:void(0)" class="datalist-link">' + value + '</a>'; }, onClickRow: function(index,row){ $('#p2-title').html(row.item); $.mobile.go('#p2'); } }) }) </script></body> </html>
\ No newline at end of file
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>DataList Selection - jQuery EasyUI Mobile Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/mobile.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.mobile.js"></script> </head><body> <div class="easyui-navpanel"> <header> <div class="m-toolbar"> <span class="m-title">DataList Selection</span> </div> </header> <div id="dl" data-options=" fit: true, border: false, lines: true, checkbox: true, singleSelect: false "> </div> </div> <script> var data = [ {"group":"FL-DSH-01","item":"Tailless"}, {"group":"FL-DSH-01","item":"With tail"}, {"group":"FL-DSH-02","item":"Adult Female"}, {"group":"FL-DSH-02","item":"Adult Male"} ]; $(function(){ $('#dl').datalist({ data: data, textField: 'item', groupField: 'group' }) }) </script></body> </html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Basic Dialog - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel" style="position:relative">
<header>
<div class="m-toolbar">
<div class="m-title">Basic Dialog</div>
</div>
</header>
<footer>
<div class="m-buttongroup m-buttongroup-justified" style="width:100%">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-picture',size:'large',iconAlign:'top',plain:true">Picture</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-clipart',size:'large',iconAlign:'top',plain:true">Clip Art</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-shapes',size:'large',iconAlign:'top',plain:true">Shapes</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-smartart',size:'large',iconAlign:'top',plain:true">SmartArt</a>
</div>
</footer>
<div style="text-align:center;margin:50px 30px">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="plain:true,outline:true" style="width:80px;height:30px" onclick="$('#dlg1').dialog('open').dialog('center')">Login</a>
</div>
<div id="dlg1" class="easyui-dialog" style="padding:20px 6px;width:80%;" data-options="inline:true,modal:true,closed:true,title:'Login'">
<div style="margin-bottom:10px">
<input class="easyui-textbox" prompt="Username" style="width:100%;height:30px">
</div>
<div>
<input class="easyui-textbox" type="password" prompt="Password" style="width:100%;height:30px">
</div>
<div class="dialog-button">
<a href="javascript:void(0)" class="easyui-linkbutton" style="width:100%;height:35px" onclick="$('#dlg1').dialog('close')">Sign in</a>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Message Dialog - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel" style="position:relative">
<header>
<div class="m-toolbar">
<div class="m-title">Message Dialog</div>
</div>
</header>
<footer>
<div class="m-buttongroup m-buttongroup-justified" style="width:100%;">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-picture',size:'large',iconAlign:'top',plain:true">Picture</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-clipart',size:'large',iconAlign:'top',plain:true">Clip Art</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-shapes',size:'large',iconAlign:'top',plain:true">Shapes</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-large-smartart',size:'large',iconAlign:'top',plain:true">SmartArt</a>
</div>
</footer>
<div style="text-align:center;margin:50px 30px">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="plain:true,outline:true" style="width:80px;height:30px" onclick="$('#dlg1').dialog('open').dialog('center')">Click me</a>
</div>
<div id="dlg1" class="easyui-dialog" style="padding:20px 6px;width:80%;" data-options="inline:true,modal:true,closed:true,title:'Information'">
<p>This is a message dialog.</p>
<div class="dialog-button">
<a href="javascript:void(0)" class="easyui-linkbutton" style="width:100%;height:35px" onclick="$('#dlg1').dialog('close')">OK</a>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Basic Form - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel" style="position:relative;padding:20px">
<header>
<div class="m-toolbar">
<div class="m-title">Basic Form</div>
<div class="m-right">
<a href="javascript:void(0)" class="easyui-linkbutton" plain="true" outline="true" onclick="$('#ff').form('reset')" style="width:60px">Reset</a>
</div>
</div>
</header>
<form id="ff">
<div style="margin-bottom:10px">
<input class="easyui-textbox" label="Full name:" prompt="Full name" style="width:100%">
</div>
<div style="margin-bottom:10px">
<input class="easyui-datebox" label="Birthday:" prompt="Birthday" data-options="editable:false,panelWidth:220,panelHeight:240,iconWidth:30" style="width:100%">
</div>
<div style="margin-bottom:10px">
<input class="easyui-passwordbox" label="Password:" prompt="Password" style="width:100%">
</div>
<div style="margin-bottom:10px">
<input class="easyui-numberbox" label="Number:" prompt="Number" style="width:100%">
</div>
<div style="margin-bottom:10px">
<label class="textbox-label">Switch:</label><!--
--><input class="easyui-switchbutton">
</div>
</form>
</div>
</body>
</html>
\ No newline at end of file
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>NumberSpinner - jQuery EasyUI Mobile Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/mobile.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.mobile.js"></script> </head><body> <div class="easyui-navpanel"> <header> <div class="m-toolbar"> <div class="m-title">NumberSpinner</div> </div> </header> <ul class="m-list"> <li> <input class="easyui-numberspinner" style="width:100%;" data-options=" label: 'Basic Number:', labelPosition: 'top' "> </li> <li> <input class="easyui-numberspinner" style="width:100%;" data-options=" label: 'Increment Number:', labelPosition: 'top', value: 1000, increment: 100 "> </li> <li> <input class="easyui-numberspinner" style="width:100%;" data-options=" label: 'Format Number:', labelPosition: 'top', value: 23893, groupSeparator: ',', decimalSeparator: '.', prefix: '$' "> </li> </ul> </div></body> </html>
\ No newline at end of file
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>TextBox - jQuery EasyUI Mobile Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/mobile.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.mobile.js"></script> </head><body> <div class="easyui-navpanel"> <header> <div class="m-toolbar"> <div class="m-title">TextBox</div> </div> </header> <ul class="m-list"> <li> <input class="easyui-textbox" style="width:100%" data-options=" label: 'Standard TextBox:', labelPosition: 'top', prompt: 'Search...' "> </li> <li> <input class="easyui-textbox" style="width:100%" data-options=" label: 'Icon:', labelPosition: 'top', iconCls: 'icon-search' "> </li> <li> <input class="easyui-textbox" style="width:100%" data-options=" label: 'Button:', labelPosition: 'top', buttonText: 'Search' "> </li> </ul> </div></body> </html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Basic Layout - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel">
<header>
<div class="m-toolbar">
<div class="m-title">Layout</div>
<div class="m-left">
<a href="javascript:void(0)" class="easyui-linkbutton m-back" plain="true" outline="true">Back</a>
</div>
<div class="m-right">
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-search" plain="true" outline="true">Search</a>
</div>
</div>
</header>
<footer style="padding:2px 3px">
<input class="easyui-textbox" style="width:100%;height:32px;" data-options="prompt:'Type something here',buttonText:'<span style=\'padding:0 15px\'>Send</span>'">
</footer>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Basic Menu - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel">
<header>
<div class="m-toolbar">
<div class="m-title">Menu</div>
<div class="m-right">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true"></a>
<a href="javascript:void(0)" class="easyui-menubutton" data-options="iconCls:'icon-more',menu:'#mm',menuAlign:'right',hasDownArrow:false"></a>
</div>
</div>
</header>
</div>
<div id="mm" class="easyui-menu" style="width:150px;">
<div data-options="iconCls:'icon-undo'">Undo</div>
<div data-options="iconCls:'icon-redo'">Redo</div>
<div class="menu-sep"></div>
<div>Cut</div>
<div>Copy</div>
<div>Paste</div>
<div class="menu-sep"></div>
<div>Toolbar</div>
<div data-options="iconCls:'icon-remove'">Delete</div>
<div>Select All</div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Menubar - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel">
<header>
<div class="m-toolbar">
<div class="m-title">
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="plain:true,outline:true" style="width:70px">Home</a>
<a href="javascript:void(0)" class="easyui-menubutton" data-options="menu:'#mm1',iconCls:'icon-edit',outline:true" style="width:70px">Edit</a>
<a href="javascript:void(0)" class="easyui-menubutton" data-options="menu:'#mm2',iconCls:'icon-help',outline:true" style="width:75px">Help</a>
<a href="javascript:void(0)" class="easyui-linkbutton" data-options="plain:true,outline:true" style="width:70px">About</a>
</div>
</div>
</header>
</div>
<div id="mm1" class="easyui-menu" style="width:150px;">
<div data-options="iconCls:'icon-undo'">Undo</div>
<div data-options="iconCls:'icon-redo'">Redo</div>
<div class="menu-sep"></div>
<div>Cut</div>
<div>Copy</div>
<div>Paste</div>
<div class="menu-sep"></div>
<div>Toolbar</div>
<div data-options="iconCls:'icon-remove'">Delete</div>
<div>Select All</div>
</div>
<div id="mm2" style="width:100px;">
<div>Help</div>
<div>Update</div>
<div>About</div>
</div>
</body>
</html>
\ No newline at end of file
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>Ajax Panel - jQuery EasyUI Mobile Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/mobile.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.mobile.js"></script> </head><body> <div class="easyui-navpanel" data-options="href:'_content.html'" style="padding:10px"> <header> <div class="m-toolbar"> <div class="m-title">Ajax Panel</div> </div> </header> <footer> <div class="m-toolbar"> <div class="m-title">Panel Footer</div> </div> </footer> </div></body> </html>
\ No newline at end of file
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <title>Basic Panel - jQuery EasyUI Mobile Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css"> <link rel="stylesheet" type="text/css" href="../../themes/mobile.css"> <link rel="stylesheet" type="text/css" href="../../themes/icon.css"> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.mobile.js"></script> </head><body> <div class="easyui-navpanel"> <header> <div class="m-toolbar"> <div class="m-title">Panel Header</div> </div> </header> <footer> <div class="m-toolbar"> <div class="m-title">Panel Footer</div> </div> </footer> </div></body> </html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Navigation Panel - jQuery EasyUI Mobile Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/mobile.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel">
<header>
<div class="m-toolbar">
<div class="m-title">Navigation</div>
</div>
</header>
<div style="margin:50px 0 0;text-align:center">
<a href="javascript:void(0)" class="easyui-linkbutton" style="width:100px;height:30px" onclick="$.mobile.go('#p2')">Goto Panel2</a>
</div>
</div>
<div id="p2" class="easyui-navpanel">
<header>
<div class="m-toolbar">
<div class="m-title">Panel2</div>
<div class="m-left">
<a href="#" class="easyui-linkbutton m-back" data-options="plain:true,outline:true,back:true">Back</a>
</div>
</div>
</header>
<div style="margin:50px 0 0;text-align:center">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$.mobile.back()">Go Back</a>
</div>
</div>
</body>
</html>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment