jquery easyui使用心得
第一步下載jquery easyui
下載地址:http://www.dbjr.com.cn/codes/70218.html
第二步創(chuàng)建Java web項(xiàng)目
第三步導(dǎo)入相關(guān)的文件。。目錄結(jié)構(gòu)如下
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <script type="text/javascript" src="easyui/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script> <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <script type="text/javascript" src="easyui/jquery.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
下載個(gè)jquery-easyui-1.3.2使用,把他導(dǎo)入到myeclipse10里,jquery-1.7.2.min.js報(bào)錯(cuò)。
解決辦法:
1、選中報(bào)錯(cuò)的jquery文件“jquery-1.7.2.min.js”。
2、右鍵選擇 MyEclipse-->Exclude From Validation 。
3、再右鍵選擇 MyEclipse-->Run Validation 即可。
ui1的源碼:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>" rel="external nofollow" > <title>jquery easyui test 1</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css" rel="external nofollow" > --> <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" > <!-- <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" > --> <!-- <link rel="stylesheet" type="text/css" href="easyui/demo.css" rel="external nofollow" > --> <script type="text/javascript" src="easyui/jquery.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script> </head> <body> <h2>Basic Panel</h2> <p>The panel is a container for other components or elements.</p> <div style="margin:20px 0 10px 0;"> <a href="#" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" onclick="javascript:$('#p').panel('open')">Open</a> <a href="#" rel="external nofollow" rel="external nofollow" class="easyui-linkbutton" onclick="javascript:$('#p').panel('close')">Close</a> </div> <div id="p" class="easyui-panel" title="Basic Panel" style="width:700px;height:200px;padding:10px;"> <p style="font-size:14px">jQuery EasyUI framework helps you build your web pages easily.</p> <ul> <li>easyui is a collection of user-interface plugin based on jQuery.</li> <li>easyui provides essential functionality for building modem, interactive, javascript applications.</li> <li>using easyui you don't need to write many javascript code, you usually defines user-interface by writing some HTML markup.</li> <li>complete framework for HTML5 web page.</li> <li>easyui save your time and scales while developing your products.</li> <li>easyui is very easy but powerful.</li> </ul> </div> <div id="p" class="easyui-panel" style="width:500px;height:200px;padding:10px;" title="My Panel" iconCls="icon-save" collapsible="true"> The panel content </div> </body> </html>
效果圖:
- 全面詳細(xì)的jQuery常見開發(fā)技巧手冊
- 60個(gè)很實(shí)用的jQuery代碼開發(fā)技巧收集
- 30個(gè)經(jīng)典的jQuery代碼開發(fā)技巧
- jQuery常見開發(fā)技巧詳細(xì)整理
- Web前端新人筆記之jquery入門心得(新手必看)
- jQuery Ajax使用心得詳細(xì)整理及注意事項(xiàng)
- 關(guān)于jQuery UI 使用心得及技巧
- php+jquery編碼方面的一些心得(utf-8 gb2312)
- Jquery ThickBox插件使用心得(不建議使用)
- 關(guān)于Jqzoom的使用心得 jquery放大鏡效果插件
- jQuery 使用個(gè)人心得
- jQuery 研究心得 取得屬性的值
- 15個(gè)值得開發(fā)人員關(guān)注的jQuery開發(fā)技巧和心得總結(jié)【經(jīng)典收藏】
相關(guān)文章
如何用jQuery實(shí)現(xiàn)ASP.NET GridView折疊伸展效果
我們今天就一個(gè)具體的需求進(jìn)行分析,引出如何用jQuery實(shí)現(xiàn)ASP.NET GridView折疊伸展效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-09-0910個(gè)基于jQuery或JavaScript的WYSIWYG 編輯器整理
10驚人的自由豐富的文本編輯器,將提升您的網(wǎng)站的功能。我已經(jīng)收集了5 jQuery和5個(gè)非jQuery實(shí)時(shí)評價(jià)附帶簡單的功能,具有辦公一樣的功能。2010-05-05jQuery學(xué)習(xí)筆記 操作jQuery對象 屬性處理
HTML文檔,不但有一系列語義標(biāo)簽,每個(gè)標(biāo)簽下屬還有一系列屬性節(jié)點(diǎn)。自然我們也想去操作這些屬性節(jié)點(diǎn)。格式仍然為$(selector).方法2012-09-09jquery的父子兄弟節(jié)點(diǎn)查找示例代碼
這篇文章主要介紹了jquery的父子兄弟節(jié)點(diǎn)的查找方法,需要的朋友可以參考下2014-03-03