剛入門的easyui
這兩天看了下easyui的教學先說說本身的一些小小理解吧！javascript
----在使用easyui中也遇到了一個問題 ：
Uncaught TypeError：cannot call method ‘offset’ of undefined//爲方法聲明...
後來在百度上搜索相關問題經發現，這是easyui 的包被修改了致使一些樣式除了問題報的錯...
1. 引入easyui主要文件：css
<script type="text/javascript" src="easyword/jEasyUi/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="easyword/jEasyUi/jquery.easyui.min.js"></script>
<script type="text/javascript" src="easyword/jEasyUi/locale/easyui-lang-zh_CN.js"></script>
<link href="easyword/jEasyUi/themes/default/easyui.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="easyword/jEasyUi/themes/icon.css" />html
2. 首先佈局按照：north（北）、south（南）、east（東）、west（西）、center（中）java
例：jquery
<body class="easyui-layout">
<div data-options="region:'north',上北 title:'North Title',split:true" style="height:100px;"></div>
<div data-options="region:'south',title:'下南Title',split:true" style="height:100px;"></div>
<div data-options="region:'east',iconCls:'icon-reload',title:' 右東East',split:true" style="width:100px;"></div>
<div data-options="region:'west',title:' 左西 West',split:true" style="width:100px;"></div>
<div data-options="region:' 中 center',title:'center title'" style="padding:5px;background:#eee;"></div>
</body>佈局
在寫分頁插件時 在手冊好像沒看見這個屬性：layout：分頁控件佈局定義，佈局選項能夠包含一個或多個值ui
1.list（頁面顯示條數列表）、2.sop（頁面按鈕分割線） 、3.first（首頁按鈕）、4.prev（上一頁按鈕）、spa
5. next（下一頁按鈕）、6.last（尾頁按鈕）、7.refresh（刷新按鈕）、8.（手工輸入當前頁的輸入框）、插件
9.links（頁面數連接）3d
例如：<div id="pp" class="easyui-pagination" data-options="total:1000,pageSize:10" style="background:#efefef;border:1px solid #ccc;"></div>
效果以下：
在使用上面layout：裏面的 links改變樣式
3. 必須知道的data-options屬性的用法（經過這個屬性，咱們能夠對easyui組件的實例化能夠徹底寫入到html中）例如：
結果以下：
4. easyui的組件屬性 也能夠寫入標籤裏面去
<div id="p" class="easyui-panel" title="My Panel" style="width:500px;height:150px;padding:10px;"
iconCls="icon-save" closable="true"
collapsible="true" minimizable="true" maximizable=true> 等同於：
<div id="p" class="easyui-panel" title="My Panel" data-options="width:500px;height:150px;padding:10px;background:#fafafa;"
iconCls="icon-save" closable="true"
collapsible="true" minimizable="true" maximizable=true>
----上面是class寫法，下面是JS寫法 例如：
<div id="login">
<p>帳號：<input class="easyui-numberbox" id="manager" type="text" name="name" value=" " /></p>
<p>密碼：<input class="easyui-numberbox" id="managerpass" type="password" name="name" value=" " /></p>
</div>
先給div一個id（「login」）
- 1. 剛入門的easyui
- 2. EasyUI學習(一)——EasyUI入門 EasyUI學習總結(一)——EasyUI入門
- 3. EasyUI入門——CRUD
- 4. EasyUI入門
- 5. EasyUI入門（DataGrid）
- 6. easyui入門
- 7. EasyUI：一、入門
- 8. easyui(入門)
- 9. EasyUI入門（panel）
- 10. EasyUI之Hello world（EasyUI的入門學習）
- 更多相關文章...
- • Memcached入門教程 - NoSQL教程
- • Neo4j數據庫入門教程 - NoSQL教程
- • YAML 入門教程
- • Java Agent入門實戰（一）-Instrumentation介紹與使用
-
每一个你不满意的现在，都有一个你没有努力的曾经。