這篇文章將為大家詳細講解有關jquery LigerUI指的是什么，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
jQuery LigerUI是基于jQuery而設計的一系列UI插件集合，其核心設計目標是快速開發、使用簡單、功能強大、輕量級、易擴展，使用UI可以幫助開發者快速地創建友好的用戶界面。
jquery LigerUI 快速開發UI框架
LigerUI 是基于jQuery 的UI框架，其核心設計目標是快速開發、使用簡單、功能強大、輕量級、易擴展。簡單而又強大，致力于快速打造Web前端界面解決方案，可以應用于.net,jsp,php等等web服務器環境。
LigerUI有如下主要特點：
使用簡單，輕量級
控件實用性強，功能覆蓋面大，可以解決大部分企業信息應用的設計場景
快速開發，使用LigerUI可以比傳統開發減少極大的代碼量
易擴展，包括默認參數、表單/表格編輯器、多語言支持等等
支持Java、.NET、PHP等web服務端
支持 IE6+、Chrome、FireFox等瀏覽器
開源，源碼框架層次簡單易懂。
Jquery LigerUI怎么使用
在寫具體的使用之前先簡單的說明下，小弟也是在項目上現學現賣，有不對的地方歡迎指正，小弟先謝過了。好了言歸正傳，大家可以在LigerUI的官方網站上下載一份源碼，我們可以在 lib/ligerUI 目錄下找到LigerUI的所有插件如下圖：
可以看到ligerUI目錄下面主要包括了，腳本，和皮膚這兩個目錄，JS下存放著ligerUi的所有插件，Skin目錄下提供了淺綠色，和灰色兩種不同風格的皮膚，大家可以根據自己的喜好選擇使用哪種皮膚。json2.js文件是用來解決ie6 和ie7不支持json對象的問題（JSON.Parse(),和JSON.stringify()）,如果你需要你的程序支持ie6和ie7瀏覽器，你可能需要引用改腳本。接下來我們用簡單例子來說明：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="http://www.cnblogs.com/lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<style type="text/css">
</style>
<script src="http://www.cnblogs.com/lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="http://www.cnblogs.com/lib/ligerUI/js/core/base.js" type="text/javascript"></script>
<script src="http://www.cnblogs.com/lib/ligerUI/js/plugins/ligerComboBox.js" type="text/javascript"></script>
<script src="http://www.cnblogs.com/lib/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
<script type="text/javascript">
$(function ()
{
$("#test1").ligerComboBox({
data: [
{ text: '張三', id: '1' },
{ text: '李四', id: '2' },
{ text: '趙武', id: '44' }
], valueFieldID: 'test3'
});
});
</script>
</head>
<body style="padding:10px">
<input type="text" id="test1" />
</body>
</html>效果如圖：
從上面的代碼我們可以看出，首先需要引入對應你風格的皮膚下的ligerui-all.css文件，需要引入jquery文件，需要引入js/core/base.js文件，這個文件就如同你在使用jquery的時候需要引入jquery 的api文件一樣，是個基礎類吧，我個人的理解是這樣。但在ligerui給出的demo中布局頁面沒有使用該文件而使用了/js/ligerui.min.js文件，我在一個項目中嘗試過，如果同時引入了這兩個則會出現錯誤，所以我在使用過程中除了布局頁面，在別的畫面中在引用ligerui別的插件之前都引用base.js文件。其次，你當前頁面使用到了哪些ligerui的控件，則必須引用js/plugins下面對應的js插件。比如上面的例子中使用了ligerui的combox控件，則必須要引用對應的ligerComboBox.js插件。 控件的初始化如例子代碼中的js部分，需要放在$(function(){...})中也就是，不同控件的初始化方法都類似，比如combox的初始化方法為$("...").ligerComboBox({...}), grid的初始化方法為("...").ligerGrid({...}).如上面的例子其中Data參數為該控件數據源參數，在ligerui中所有的數據源只能試用JSON格式，不同插架的具體參數、事件、方法請參考官方api：
在實際的項目中我們的數據源肯定是動態從數據庫中存取，下面我將我在項目中使用的將DataTable轉換為Json格式的類貼出來，有需要的可以拿去用。
public class JsonOperation
{
/// <summary>
/// DataTable轉換Json
/// </summary>
/// <param name="dtSource">轉換數據源</param>
/// <param name="strJosonCols">Joson格式列</param>
/// <param name="strParCols">DataTable格式列</param>
/// <returns>Json字符串</returns>
public static string DataTableToJson(DataTable Source, string[] strJosonCols, string[] strParCols)
{
StringBuilder Json = new StringBuilder();
Json.Append("[");
if (Source.Rows.Count > 0)
{
for (int intRow = 0; intRow < Source.Rows.Count; intRow++)
{
Json.Append("{");
for (int intCol = 0; intCol < strJosonCols.Length; intCol++)
{
Json.Append(strJosonCols[intCol] + ":\"" + Source.Rows[intRow][strParCols[intCol]].ToString().Replace("\"","").Trim() + "\"");
if (intCol < strJosonCols.Length - 1)
{
Json.Append(",");
}
}
Json.Append("}");
if (intRow < Source.Rows.Count - 1)
{
Json.Append(",");
}
}
}
Json.Append("]");
return Json.ToString();
}
/// <summary>
/// DataTable轉換Json
/// </summary>
/// <param name="dtSource">轉換數據源</param>
/// <returns>Json字符串</returns>
public static string DataTableToJson(DataTable Source)
{
StringBuilder Json = new StringBuilder();
Json.Append("[");
if (Source.Rows.Count > 0)
{
for (int i = 0; i < Source.Rows.Count; i++)
{
Json.Append("{");
for (int j = 0; j < Source.Columns.Count; j++)
{
Json.Append(Source.Columns[j].ColumnName.ToString() + ":\"" + Source.Rows[i][j].ToString() + "\"");
if (j < Source.Columns.Count - 1)
{
Json.Append(",");
}
}
Json.Append("}");
if (i < Source.Rows.Count - 1)
{
Json.Append(",");
}
}
}
Json.Append("]");
return Json.ToString();
}
}關于jquery LigerUI指的是什么就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
