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的更多相关文章

  1. 《IT蓝豹》吹雪花demo,学习android传感器

    吹雪花demo,学习android传感器 吹雪花demo,学习android传感器,嘴巴对着手机底部吹一下就会出现飘着雪花效果. 算是学习android传感器效果.本例子主要是通过android.me ...

  2. [Unity3D]做个小Demo学习Input.touches

    [Unity3D]做个小Demo学习Input.touches 学不如做,下面用一个简单的Demo展示的Input.touches各项字段,有图有真相. 本项目已发布到Github,地址在(https ...

  3. 学习使用 jQuery & CSS3 制作照片堆栈效果

    在这个小实验中,我们使用 jQuery & CSS3 创建了一个交互式的照片堆栈效果.提供了一些模拟现实的互动的可能性给用户.这个想法的思路是:有一些照片在桌面上可以拖放一样,堆放和删除,每个 ...

  4. web前端开发学习:jQuery的原型中的init

    web前端开发学习:jQuery的原型中的init 有大量web前端开发工具及学习资料,可以搜群[ web前端学习部落22群 ]进行下载,遇到学习问题也可以问群内专家以及课程老师哟 jQuery.fn ...

  5. 前端学习之jquery/下

    前端学习之jquery 一 属性操作 html(): console.log($("div").html()); $(".test").html("& ...

  6. 前端学习之jquery

    前端学习之jquery 1.   什么是jQuery对象? jQuery对象就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它 ...

  7. Python学习-day17 jQuery method and demo

    一:介绍: jQuery:是DOM和js的封装.jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多).现在大多数的pc端的网站都 ...

  8. jquery学习笔记---jquery插件开发

    http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html jquery插件开发:http://www.cnblogs.com/damonla ...

  9. 非常easy学习的JQuery库 : (二) 选择器

    作用 选择器同意您对元素组或单个元素进行操作. 在前面的章节中,我们介绍了一些有关怎样选取 HTML 元素的实例. 关键点是学习 jQuery 选择器是怎样准确地选取您希望应用效果的元素. jQuer ...

随机推荐

  1. java cpu load

    $ps -Lp 179093 cu | more USER PID LWP %CPU NLWP %MEM VSZ RSS TTY STAT START TIME COMMAND admin 17909 ...

  2. Centos7.5 java环境的安装配置

    1.查看系统中的java环境 [root@localhost ~]# java -version openjdk version "1.8.0_101" OpenJDK Runti ...

  3. hdu 4729 树链剖分

    思路:这个树链剖分其实还是比较明显的.将边按权值排序后插入线段树,然后用线段树查找区间中比某个数小的数和,以及这样的数的个数.当A<=B时,就全部建新的管子. 对于A>B的情况比较 建一条 ...

  4. Asp.net的内置对象!!!

    还记得自己第一次面试的时候,面试官问的问题就是.net内置对象的问题,当时就让尴尬的要死... 所以作为新手的我们还是要知道这些轮廓的东西的! 1.Response对象 2.Request对象 3.A ...

  5. sharepoint 2013 "The module ... owssvr.dll could not be loaded due to a configuration problem"

    打开sharepoint站点可以看到这个503的错误, 在event viewer中查看如下: The Module DLL 'C:\Program Files\Common Files\Micros ...

  6. 《JavaScript高级程序设计》笔记——关于继承

    继承在JavaScript中是一种“奇葩”的存在,因为其本身并没有类(class)的概念(ES5),所以只能用其他方式(原型链.构造函数.对象实例)来模拟继承的行为.既然是模拟,那就应该是想办法实现继 ...

  7. 设置input(radio,checkbox)和lable对齐的问题

    在做页面的时候几次遇到label和前面的小图标无法对齐的情况,后来发现解决方法不过是 label { display:inline-block; vertical-align:top; line-he ...

  8. 跟我学习dubbo-ZooKeeper注册中心安装(2)

    注册中心 可选方案:zookeeper.Redis 1.建议使用dubbo-2.3.3以上版本的使用zookeeper注册中心客户端 2.Zookeeper是Apache Hadoop的子项目,强度相 ...

  9. node.js安装方法总结

    为了保持一致,这里也列举三个方法 第一个方法:通过官网下载安装 https://nodejs.org/en/download/ 这种方式的问题是我们需要自己去找网页,找到链接,然后下载 第二个方法:使 ...

  10. 20150225--ASP.NET基础(2)

    一.引用外部样式表或JS,在<head>-</head>标签之间添加: <link href="yangshi.css" type="tex ...