在项目中托管Kendo UI

要在项目中托管Kendo UI,你须要:

下载bundles添加CSS和JavaScript引用

下载bundles

用jsp做UIKendo UI应用教程入门指南 Python

下载任何Kendo UI软件包后,下面列出的文件夹将托管在您确当地存储库中。

/apptemplates——该文件夹包含独立的启动器模板。
虽然它们是静态HTML文件,但建议您通过Web做事器而不是直接从文件系统打开它们,后一种方法会毁坏所有Ajax数据要求。
/examples——容纳快速启动示例文件。
虽然它们是静态HTML文件,但建议您通过Web做事器而不是直接从文件系统打开它们,后一种方法会毁坏所有Ajax数据要求。
/js——包含缩小的JavaScript文件。
/src——此文件夹用于保存源代码文件,但现在它们在单独的下载包中供应。
从你账户的Downloads部分访问源代码包,请把稳试用版用户无法利用源代码。
/styles——由缩小的CSS文件和主题图像组成。
该文件夹还包含Less文件,可以通报给编译器,位于styles/folder: styles/web/和styles/mobile/的第一级文件夹。
请把稳,试用版中不供应Less文件。
/wrappers——包括做事器端包装器。
由于UI for ASP.NET MVC、UI for JSP或UI for PHP发行版是必须的,因此该文件夹仅在这些版本的商业包中可用。
changelog.html——供应Kendo UI更新解释。

添加CSS和JavaScript引用

要在项目中利用Kendo UI,请包含所需的JavaScript和CSS文件。

Step 1:从bundle存档中提取 /js和/styles目录,并将它们复制到Web运用程序根目录。

Step 2:在HTML文档的head标记中包含Kendo UI JavaScript和CSS文件,验证在主题CSS文件之前注册了公共CSS文件。

示例:

<!DOCTYPE html>

<html>

<head>

<title>Welcome to Kendo UI!</title>

<!-- Common Kendo UI CSS for web widgets and widgets for data visualization. -->

<link href=\公众styles/kendo.common.min.css\公众 rel=\"大众stylesheet\"大众 />

<!-- (Optional) RTL CSS for Kendo UI widgets for the web. Include only in right-to-left applications. -->

<link href=\"大众styles/kendo.rtl.min.css\公众 rel=\"大众stylesheet\"大众 type=\"大众text/css\公众 />

<!-- Default Kendo UI theme CSS for web widgets and widgets for data visualization. -->

<link href=\"大众styles/kendo.default.min.css\"大众 rel=\公众stylesheet\公众 />

<!-- (Optional) Kendo UI Hybrid CSS. Include only if you will use the mobile devices features. -->

<link href=\"大众styles/kendo.default.mobile.min.css\公众 rel=\"大众stylesheet\"大众 type=\"大众text/css\"大众 />

<!-- jQuery JavaScript -->

<script src=\公众js/jquery.min.js\公众></script>

<!-- Kendo UI combined JavaScript -->

<script src=\"大众js/kendo.all.min.js\"大众></script>

</head>

<body>

Hello World!

</body>

</html>

把稳:代码示例往后假设Kendo UI scripts和stylesheets现在已添加到文档中。

Step 3:初始化一个小部件

以下示例演示如何初始化DatePicker小部件。

示例:

<!-- HTML element from which the DatePicker would be initialized -->

<input id=\"大众datepicker\公众 />

<script>

$(function() {

// Initialize the Kendo UI DatePicker by calling the kendoDatePicker jQuery plugin

$(\公众#datepicker\"大众).kendoDatePicker();

});

</script>

以下示例演示了DatePicker小部件的完备初始化。

示例:

<!DOCTYPE html>

<html>

<head>

<title>Welcome to Kendo UI!</title>

<link href=\公众styles/kendo.common.min.css\公众 rel=\公众stylesheet\公众 />

<link href=\"大众styles/kendo.default.min.css\"大众 rel=\"大众stylesheet\公众 />

<script src=\公众js/jquery.min.js\公众></script>

<script src=\公众js/kendo.all.min.js\"大众></script>

</head>

<body>

<input id=\公众datepicker\"大众 />

<script>

$(function() {

$(\公众#datepicker\"大众).kendoDatePicker();

});

</script>

</body>

</html>

安装Bower包

Bower是一个盛行的Web管理程序包管理器,用于处理框架、库、资产和实用程序。

概要

Kendo UII掩护2个Bower包:

Kendo UI Core.Kendo UI Professional.

所有正式版本,Service Pack和内部版本都会上传到它们中。

重复非常的分隔符

截至Kendo UI 2016 Q2(2016.2.504)更新:

Scheduler用逗号(,)更换分号(;)作为重复非常的分隔符类型。
Scheduler不再向重复非常添加尾随分隔符。

利用CDN做事

Kendo UI CDN托管在Amazon CloudFront上。
要访问CDN做事,您可以利用不同的方法。

Kendo UI R2 2019 SP1全新发布,最新动态请持续关注Telerik中文网!

点击“理解更多”获取最新试用版!