概述

立即下載Kendo UI for jQuery

Kendo UI ActionSheet是一個(gè)對(duì)話框并顯示了一組供用戶選擇的選項(xiàng)，它會(huì)出現(xiàn)在應(yīng)用程序內(nèi)容的頂部，用戶必須手動(dòng)刪除它才能恢復(fù)與應(yīng)用程序的交互。

ActionSheet是Kendo UI for jQuery的一部分，這是一個(gè)專(zhuān)業(yè)級(jí)的UI庫(kù)，包含110+組件，用于構(gòu)建現(xiàn)代和功能豐富的應(yīng)用程序。

初始化動(dòng)作表

要初始化ActionSheet請(qǐng)使用<div>標(biāo)簽。

下面的例子演示了如何從現(xiàn)有的<div>元素中初始化ActionSheet：

<div id="actionsheet"></div>
<script>
var actionsheet = $('#actionsheet').kendoActionSheet({
title:'Select item',
items:[
{
text: 'Edit Item',
iconClass: 'k-icon k-i-edit',
click: onClick
},
{
text: 'Add to Favorites',
iconClass: 'k-icon k-i-heart',
click: onClick
},
{
text: 'Upload New',
iconClass: 'k-icon k-i-upload',
click: onClick
},
{
text: 'Cancel',
iconClass: 'k-icon k-i-cancel',
group: 'bottom',
click: onClick
},
]
}).data('kendoActionSheet');

function onClick(e) {
e.preventDefault();
actionsheet.close();
}
actionsheet.open();
setTimeout(function(){actionsheet.close()},2000)
</script

功能和特性

items——配置允許您設(shè)置各種屬性，比如圖標(biāo)和文本。

events——組件公開(kāi)的事件。

Accessibility——ActionSheet支持各種可訪問(wèn)性標(biāo)準(zhǔn)。