jQuery實現(xiàn)倒計時（倒計時年月日可自己輸入）
683
2024-02-10
使用EasyUI最好的方法不是學(xué)會，所有的東西都敲一遍，你也沒辦法敲得完，而是找到一個好的文檔。
http://xiazai.gimoo.net/201611/yuanma/jQueryEasyUI(gimoo.net).rar
jQueryEasyUI的使用方法其實非常簡單。在第一次使用中，也還是碰到了些問題，特地做了一個簡單的示例，然后復(fù)制過來文檔。
頁面代碼：
<html>
<head>
<title>jQuery EasyUI學(xué)習(xí)</title>
<script src="http://www.gimoo.net/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="http://www.gimoo.net/Scripts/jquery.easyui.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function() {
$("#Tree").tree({
url: "/Home/GetJson",
onClick: function(node) {
alert(node.text);
}
})
})
</script>
</head>
<body>
<ul id="Tree">
</ul>
</body>
</html>
后臺代碼：
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult About()
{
return View();
}
public ActionResult GetJson()
{
Node node4 = new Node(4, "java從入門到精通", "open", null);
Node node5 = new Node(5, "30天精通C#", "open", null);
List<Node> ListNode2 = new List<Node>() { node4 };
List<Node> ListNode3 = new List<Node>() { node5 };
Node node2 = new Node(2, "java分類", "closed", ListNode2);
Node node3 = new Node(3, "c#分類", "closed", ListNode3);
List<Node> ListNode1 = new List<Node>() { node2, node3 };
Node node1 = new Node(1, "圖書分類", "closed", ListNode1);
List<Node> ListNode0 = new List<Node>() { node1 };
return Json(ListNode0, JsonRequestBehavior.AllowGet);
}
}
public class Node
{
public Node(int Id,string Text,string IconCls, List<Node> Children)
{
id = Id;
text = Text;
iconCls = IconCls;
children = Children;
}
public int id
{
get;
set;
}
public string text
{
get;
set;
}
public string iconCls
{
get;
set;
}
public List<Node> children
{
get;
set;
}
}
顯示效果如下：
上面的示例中沒有方法的調(diào)用示例，jQueryEasyUI方法的調(diào)用很奇葩的說，如：
alert($("#Tree").tree('getRoot').text); //調(diào)用getRoot方法
$("#Tree").tree('collapseAll'); //調(diào)用collapseAll方法
參數(shù)：
名稱
類型
說明
默認值
url
string
獲取遠程數(shù)據(jù)的 URL 。
null
method
string
獲取數(shù)據(jù)的 http method 。
post
animate
boolean
定義當節(jié)點展開折疊時是否顯示動畫效果。
false
checkbox
boolean
定義是否在每個節(jié)點前邊顯示 checkbox 。
false
cascadeCheck
boolean
定義是否級聯(lián)檢查。
true
onlyLeafCheck
boolean
定義是否只在葉節(jié)點前顯示 checkbox 。
false
dnd
boolean
定義是否啟用拖放。
false
data
array
加載的節(jié)點數(shù)據(jù)。
null
事件
很多事件的回調(diào)函數(shù)需要 'node' 函數(shù)，它包含下列特性：
id：綁定到節(jié)點的標識值。
text：顯示的文字。
checked：是否節(jié)點被選中。
attributes：綁定到節(jié)點的自定義屬性。
target：目標的 DOM 對象。
名稱
參數(shù)
說明
onClick
node
當用戶點擊一個節(jié)點時觸發(fā)， node 參數(shù)包含下列特性：
id：節(jié)點的 id
text：節(jié)點的文字
checked：節(jié)點是否被選中
attributes：節(jié)點自定義屬性
target：被點擊目標的 DOM 對象
onDblClick
node
當用戶雙擊一個節(jié)點時觸發(fā)。
onBeforeLoad
node, param
當加載數(shù)據(jù)的請求發(fā)出前觸發(fā)，返回 false 就取消加載動作。
onLoadSuccess
node, data
當數(shù)據(jù)加載成功時觸發(fā)。
onLoadError
arguments
當數(shù)據(jù)加載失敗時觸發(fā)， arguments 參數(shù)與 jQuery.ajax 的'error' 函數(shù)一樣。.
onBeforeExpand
node
節(jié)點展開前觸發(fā)，返回 false 就取消展開動作。
onExpand
node
當節(jié)點展開時觸發(fā)。
onBeforeCollapse
node
節(jié)點折疊前觸發(fā)，返回 false 就取消折疊動作。
onCollapse
node
當節(jié)點折疊時觸發(fā)。
onCheck
node, checked
當用戶點擊 checkbox 時觸發(fā)。
onBeforeSelect
node
節(jié)點被選中前觸發(fā)，返回 false 就取消選擇動作。
onSelect
node
當節(jié)點被選中時觸發(fā)。
onContextMenu
e, node
當右鍵點擊節(jié)點時觸發(fā)。
onDrop
target, source, point
當節(jié)點被拖拽施放時觸發(fā)。
target：DOM 對象，拖放的目標節(jié)點。
source：源節(jié)點。
point：表示拖放操作，可能是值是： 'append'、'top' 或 'bottom'。
onBeforeEdit
node
編輯節(jié)點前觸發(fā)。
onAfterEdit
node
編輯節(jié)點后觸發(fā)。
onCancelEdit
node
當取消編輯動作時觸發(fā)。
方法
名稱
參數(shù)
說明
options
none
返回樹的 options。
loadData
data
加載樹的數(shù)據(jù)。
getNode
target
獲取指定的節(jié)點對象。
getData
target
獲取指定的節(jié)點數(shù)據(jù)，包括它的子節(jié)點。
reload
target
重新加載樹的數(shù)據(jù)。
getRoot
none
獲取根節(jié)點，返回節(jié)點對象。
getRoots
none
獲取根節(jié)點們，返回節(jié)點數(shù)組。
getParent
target
獲取父節(jié)點， target 參數(shù)指節(jié)點的 DOM 對象。
getChildren
target
獲取子節(jié)點， target 參數(shù)指節(jié)點的 DOM 對象。
getChecked
none
獲取所有選中的節(jié)點。
getSelected
none
獲取選中的節(jié)點并返回它，如果沒有選中節(jié)點，就返回 null。
isLeaf
target
把指定的節(jié)點定義成葉節(jié)點， target 參數(shù)表示節(jié)點的 DOM 對象。
find
id
找到指定的節(jié)點并返回此節(jié)點對象。
select
target
選中一個節(jié)點， target 參數(shù)表示節(jié)點的 DOM 對象。
check
target
把指定節(jié)點設(shè)置為勾選。
uncheck
target
把指定節(jié)點設(shè)置為未勾選。
collapse
target
折疊一個節(jié)點， target 參數(shù)表示節(jié)點的 DOM 對象。
expand
target
展開一個節(jié)點， target 參數(shù)表示節(jié)點的 DOM 對象。
collapseAll
target
折疊所有的節(jié)點們。
expandAll
target
展開所有的節(jié)點們。
expandTo
target
從指定節(jié)點的根部展開。
append
param
追加一些子節(jié)點們到一個父節(jié)點， param 參數(shù)有兩個特性：
parent：DOM 對象，追加到的父節(jié)點，如果沒有分配，則追加為根節(jié)點。
data：數(shù)組，節(jié)點們的數(shù)據(jù)。
toggle
target
切換節(jié)點的展開/折疊狀態(tài)， target 參數(shù)表示節(jié)點的 DOM 對象。
insert
param
在指定節(jié)點的前邊或后邊插入一個節(jié)點， param 參數(shù)包含下列特性：
before：DOM 對象，前邊插入的節(jié)點。
after：DOM 對象，后邊插入的節(jié)點。
data：對象，節(jié)點數(shù)據(jù)。
remove
target
移除一個節(jié)點和它的子節(jié)點們， target 參數(shù)表示節(jié)點的 DOM 對象。
pop
target
彈出一個節(jié)點和它的子節(jié)點們，此方法和 remove 一樣，但是返回了移除的節(jié)點數(shù)據(jù)。
update
param
跟心指定的節(jié)點， param 參數(shù)有下列特性：
target（DOM 對象，被更新的節(jié)點）、id、text、iconCls、checked、等等。
enableDnd
none
啟用拖放功能。
disableDnd
none
禁用拖放功能。
beginEdit
nodeEl
開始編輯節(jié)點。
endEdit
nodeEl
結(jié)束編輯節(jié)點。
cancelEdit
nodeEl
取消編輯節(jié)點。
以上就是本文的全部內(nèi)容，希望對大家有所幫助，謝謝對綠夏網(wǎng)的支持！
