Kendo UI使用教程:入门指南 kendo.ui.progress
lipiwang 2024-11-07 12:48 5 浏览 0 评论
Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四个控件。Kendo UI for jQuery是创建现代Web应用程序的最完整UI库;Kendo UI for Angular是专用于Angular开发的专业级Angular UI组件;Kendo UI Support for React支持React Javascript框架,更快地构建更好的应用程序;Kendo UI Support for Vue为Vue技术框架提供可用的Kendo UI组件,更快地构建更好的Vue应用程序。
在项目中托管Kendo UI
要在项目中托管Kendo UI,你需要:
- 下载bundles
- 添加CSS和JavaScript引用
下载bundles
下载任何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中文网!
点击“了解更多”获取最新试用版!
相关推荐
- linux实例之设置时区的方式有哪些
-
linux系统下的时间管理是一个复杂但精细的功能,而时区又是时间管理非常重要的一个辅助功能。时区解决了本地时间和UTC时间的差异,从而确保了linux系统下时间戳和时间的准确性和一致性。比如文件的时间...
- Linux set命令用法(linux cp命令的用法)
-
Linux中的set命令用于设置或显示系统环境变量。1.设置环境变量:-setVAR=value:设置环境变量VAR的值为value。-exportVAR:将已设置的环境变量VAR导出,使其...
- python环境怎么搭建?小白看完就会!简简单单
-
很多小伙伴安装了python不会搭建环境,看完这个你就会了Python可应用于多平台包括Linux和MacOSX。你可以通过终端窗口输入"python"命令来查看本地是否...
- Linux环境下如何设置多个交叉编译工具链?
-
常见的Linux操作系统都可以通过包管理器安装交叉编译工具链,比如Ubuntu环境下使用如下命令安装gcc交叉编译器:sudoapt-getinstallgcc-arm-linux-gnueab...
- JMeter环境变量配置技巧与注意事项
-
通过给JMeter配置环境变量,可以快捷的打开JMeter:打开终端。执行jmeter。配置环境变量的方法如下。Mac和Linux系统在~/.bashrc中加如下内容:export...
- C/C++|头文件、源文件分开写的源起及作用
-
1C/C++编译模式通常,在一个C++程序中,只包含两类文件——.cpp文件和.h文件。其中,.cpp文件被称作C++源文件,里面放的都是C++的源代码;而.h文件则被称...
- linux中内部变量,环境变量,用户变量的区别
-
unixshell的变量分类在Shell中有三种变量:内部变量,环境变量,用户变量。内部变量:系统提供,不用定义,不能修改环境变量:系统提供,不用定义,可以修改,可以利用export将用户变量转为环...
- 在Linux中输入一行命令后究竟发生了什么?
-
Linux,这个开源的操作系统巨人,以其强大的命令行界面而闻名。无论你是初学者还是经验丰富的系统管理员,理解在Linux终端输入一条命令并按下回车后发生的事情,都是掌握Linux核心的关键。从表面上看...
- Nodejs安装、配置与快速入门(node. js安装)
-
Nodejs是现代JavaScript语言产生革命性变化的一个主要框架,它使得JavaScript从一门浏览器语言成为可以在服务器端运行、开发各种各样应用的通用语言。在不同的平台下,Nodejs的安装...
- Ollama使用指南【超全版】(olaplex使用方法图解)
-
一、Ollama快速入门Ollama是一个用于在本地运行大型语言模型的工具,下面将介绍如何在不同操作系统上安装和使用Ollama。官网:https://ollama.comGithub:http...
- linux移植(linux移植lvgl)
-
1uboot移植l移植linux之前需要先移植一个bootlader代码,主要用于启动linux内核,lLinux系统包括u-boot、内核、根文件系统(rootfs)l引导程序的主要作用将...
- Linux日常小技巧参数优化(linux参数调优)
-
Linux系统参数优化可以让系统更加稳定、高效、安全,提高系统的性能和使用体验。下面列出一些常见的Linux系统参数优化示例,包括修改默认配置、网络等多方面。1.修改默认配置1.1修改默认编辑器默...
- Linux系统编程—条件变量(linux 条件变量开销)
-
条件变量是用来等待线程而不是上锁的,条件变量通常和互斥锁一起使用。条件变量之所以要和互斥锁一起使用,主要是因为互斥锁的一个明显的特点就是它只有两种状态:锁定和非锁定,而条件变量可以通过允许线程阻塞和等...
- 面试题-Linux系统优化进阶学习(linux系统的优化)
-
一.基础必备优化:1.关闭SElinux2.FirewalldCenetOS7Iptables(C6)安全组(阿里云)3.网络管理服务||NetworkManager|network...
- 嵌入式Linux开发教程:Linux Shell
-
本章重点介绍Linux的常用操作和命令。在介绍命令之前,先对Linux的Shell进行了简单介绍,然后按照大多数用户的使用习惯,对各种操作和相关命令进行了分类介绍。对相关命令的介绍都力求通俗易懂,都给...
你 发表评论:
欢迎- 一周热门
- 最近发表
- 标签列表
-
- maven镜像 (69)
- undefined reference to (60)
- zip格式 (63)
- oracle over (62)
- date_format函数用法 (67)
- 在线代理服务器 (60)
- shell 字符串比较 (74)
- x509证书 (61)
- localhost (65)
- java.awt.headless (66)
- syn_sent (64)
- settings.xml (59)
- 弹出窗口 (56)
- applicationcontextaware (72)
- my.cnf (73)
- httpsession (62)
- pkcs7 (62)
- session cookie (63)
- java 生成uuid (58)
- could not initialize class (58)
- beanpropertyrowmapper (58)
- word空格下划线不显示 (73)
- jar文件 (60)
- jsp内置对象 (58)
- makefile编写规则 (58)