Demo学习: Basic jQuery
UniGUI是一套基于ExtJS的Delphi的WEB框架,它是使用ExtPascal来转化到ExtJS,ExtJS是一个跨浏览器的JavaScript库,
因此UniGUI发布出来的程序可以在各种浏览器上运行。支持多种部署方式:独立EXE、Apache、ISAPI .
由于工作需要使用UniGUI开发了一些小项目,UniGUI有较好的开发效率和扩展性。
目前已经很少试用UniGUI了, 在这把自己以前的学习笔记整理分享到博客上。
Basic jQuery
学习了TUniHTMLFrame的基本用法以及引用外部JS控件库的方法;
一、 使用第三方JS库
要在uniGUI里引用第三方JS库需要首选在ServerModule单元的” CustomFiles”属性添加JS库文件路径,然后在界面里面执行代码。
这个例子引用了第三方jquery库来显示时钟界面。
引用库:ServerModule -> ” CustomFiles”
files/jdigiclock/css/jquery.jdigiclock.css
files/jdigiclock/lib/jquery-1.3.2.min.js
files/jdigiclock/lib/jquery.jdigiclock.js
files/clockdemo/styles.css
files/clockdemo/jquery.tzineClock/jquery.tzineClock.css
files/clockdemo/jquery.tzineClock/jquery.tzineClock.js
二、 TUniHTMLFrame
TUniHTMLFrame是个比较灵活的控件,在这个组件里可以嵌入需要的JS代码来扩展控件,项目中使用到的ZTree、HideChart都在这个控件上扩展的。
“AfterScript”、“HTML”是TUniHTMLFrame的2个主要属性,时钟的显示就用到了这两个属性。
1. TUniHTMLFrame控件的“AfterScript”属性添加了初始化代码:
$('#digiclock').jdigiclock({
clockImagesPath: "files/jdigiclock/images/clock/",
weatherImagesPath: "files/jdigiclock/images/weather/",
});
DOM对象被加载完成后执行以上代码,他调用了jquery.jdigiclock.js里面的jdigiclock函数来初始化时钟;
2. TUniHTMLFrame控件的“HTML”属性添加显示时钟的div容器
<div id="digiclock"></div>
“digiclock”是div的ID,是用来显示时钟的容器。
Demo学习: Basic jQuery的更多相关文章
- 《IT蓝豹》吹雪花demo,学习android传感器
吹雪花demo,学习android传感器 吹雪花demo,学习android传感器,嘴巴对着手机底部吹一下就会出现飘着雪花效果. 算是学习android传感器效果.本例子主要是通过android.me ...
- [Unity3D]做个小Demo学习Input.touches
[Unity3D]做个小Demo学习Input.touches 学不如做,下面用一个简单的Demo展示的Input.touches各项字段,有图有真相. 本项目已发布到Github,地址在(https ...
- 学习使用 jQuery & CSS3 制作照片堆栈效果
在这个小实验中,我们使用 jQuery & CSS3 创建了一个交互式的照片堆栈效果.提供了一些模拟现实的互动的可能性给用户.这个想法的思路是:有一些照片在桌面上可以拖放一样,堆放和删除,每个 ...
- web前端开发学习:jQuery的原型中的init
web前端开发学习:jQuery的原型中的init 有大量web前端开发工具及学习资料,可以搜群[ web前端学习部落22群 ]进行下载,遇到学习问题也可以问群内专家以及课程老师哟 jQuery.fn ...
- 前端学习之jquery/下
前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...
- 前端学习之jquery
前端学习之jquery 1. 什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...
- Python学习-day17 jQuery method and demo
一:介绍: jQuery:是DOM和js的封装.jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多).现在大多数的pc端的网站都 ...
- jquery学习笔记---jquery插件开发
http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html jquery插件开发:http://www.cnblogs.com/damonla ...
- 非常easy学习的JQuery库 : (二) 选择器
作用 选择器同意您对元素组或单个元素进行操作. 在前面的章节中,我们介绍了一些有关怎样选取 HTML 元素的实例. 关键点是学习 jQuery 选择器是怎样准确地选取您希望应用效果的元素. jQuer ...
随机推荐
- Tested work with China Digiprog 3 4.94 mileage programmer
I was thinking about buying a Digiprog3 clone from China I know that YANHUA Digiprog 3 is the best a ...
- Hadoop学习笔记(3)——分布式环境搭建
Hadoop学习笔记(3) ——分布式环境搭建 前面,我们已经在单机上把Hadoop运行起来了,但我们知道Hadoop支持分布式的,而它的优点就是在分布上突出的,所以我们得搭个环境模拟一下. 在这里, ...
- 给定数组a[N]构造数组b[N]
转自:http://blog.csdn.net/wumuzi520/article/details/7841280 给定一个数组a[N],我们希望构造数组b [N], 其中b[j]=a[0]*a[1] ...
- 写过的HTML标签(一)
HTML > 标题显示字体大小为<h1>. HTML 段落是通过标签 <p> 来定义的. HTML 链接是通过标签 <a> 来定义的. 实例: < ...
- nodejs5-package.json
name:包名,唯一,由小写字符.数字和下划线组成,不能有空格 preferglobal:是否支持全局安装,true表示支持 descrition:描述 version:版本号 author:作者信息 ...
- ES6:JavaScript 新特性
我相信,在ECMAScript.next到来的时候,我们现在每天都在写的JavaScript代码将会发生巨大的变化.接下来的一年将会是令JavaScript开发者们兴奋的一年,越来越多的特性提案将被最 ...
- Sublime_Tip_01
//JerryWeb //20150601 //WebTool | Sublime ======= Sublime_Tip_01======= 接触了Sublime后,才真正开始爱上了coding # ...
- Java开发从零开始填坑
开始学习Java,感觉较.NET知识更零碎一些,所以开个帖子把自己踩过的坑记录下来,都是边边角角网上不容易找到的东西. 1.java命令格式:>cd %parent-of-pakadgePath ...
- [CAMCOCO][C#]我的系统架构.服务器端.(四)----Model层 实体的自我验证
这是Model的第二篇,上一篇点这里 这块完全是扒了@何镇汐大神博客里的教程实现的,在这之前完全没想到数据验证居然可以这样做!!在此表示严重感谢!!! 点击这里可以去了解这个方法的原理,老胡估计自己是 ...
- 关于SVN下载代码和Android Studio里面导入别人代码build tools不一致问题总结
项目build tools的sdk我没有 网络问题没法下载. 解决问题 方法 1.下载对应的SDK.需要VPN,或者FQ 2.将bulid.gradle的内容用下面的内容替换 // Top-level ...