IW 依赖 js 构建(我数了数, 在当前版本它的资源文件默认携带了 26 个 js);

但 IW 尽可能地让用户少用或不用 js, 但如果你对 js 也不陌生, IW 提供了多种途径与方便. 我给它分两大类:

1、直接写入 js 代码(站点级、页面级, 还可以精确地指定插入位置);

2、链接 *.js 文件(外链、内链, 还可以是资源文件).


首先应该说明: IW 已经霸占了 window.onload, 用户在 js 中不能再使用 onload. 如果你有一个 js 文件或模板没有如期运作, 或许是这个原因; 不过好像仅此一个, 剩下的都是方便了.

还有: 在 IW 中可以直接使用 jQuery, 当前版本携带的是: jQuery 1.8.2


1.1 - 使用窗体的 AddToInitProc 插入初始化的 js 代码


procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
AddToInitProc('alert("欢迎")'); //其中的 js 代码最终会被 window.onload 调用
end;

1.2 - 在控件的 ScriptEvents 属性中添加 js 代码


procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
IWButton1.ScriptEvents.Values['onclick'] := 'alert(this.name)'; //这里的代码都应该很简单, 主要是函数调用
end; {这在设计时更方便:}


1.3 - 可以把 js 函数写在窗体的 JavaScripts 属性中


//如果不是使用 js 文件, 就应该把 js 函数都写在 JavaScripts 属性中
procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
JavaScript.Text := 'function MyFun1() {alert("TIWForm1.JavaScripts");}';
IWButton1.ScriptEvents.Values['onclick'] := 'MyFun1()';
end; {建议在设计时使用 JavaScripts 属性}

1.4 - 只执行一次的 js 代码:


procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
JavaScriptOnce := 'alert("JavaScriptOnce")';
end;

1.5 - 如果要进行精确的定位插入, 需要用到窗体的 PageContext 属性


//PageContext 对象提供了更多插入方法, 下面几个只是我找到执行顺序的(下面次序就是我测试出的执行顺序)
PageContext.JavaScript;
PageContext.AddToJavaScriptOnce();
PageContext.AddToOnReady();
PageContext.AddToInitProc();
PageContext.AddToIWCLInitProc();
PageContext.AddToInitProcPageUnlockCode();
PageContext.AddToInitProcFocusCode();
PageContext.AddToInitProcNewWindowCode();
PageContext.AddToInitProcDoLastCode();

2.1 - 直接 Html 的 <Head></Head> 插入链接或代码


{在 TIWServerController 的 onCreate 事件中插入全站级的 js 链接}
procedure TIWServerController.IWServerControllerBaseCreate(Sender: TObject);
begin
HTMLHeaders.Add('<script type="text/javascript" src="/My1.js"></script>'); //内链, 文件位于 wwwroot
HTMLHeaders.Add('<script type="text/javascript" src="Http://.../My2.js"></script>'); //外链, 全路径
end;
//注: wwwroot 是 IW 的默认根目录, js、css 和图片等等都应该放在其中; 可通过 IWServerController.ContentPath 读取其实际路径 {在窗体的 OnCreate 事件中插入页面级的 js 链接}
procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
PreHeader.Add('<script type="text/javascript" src="/My3.js"></script>'); //这个在前; 但在 IWServerController.HTMLHeaders 之后
ExtraHeader.Add('<script type="text/javascript" src="/My4.js"></script>'); //这个在后
end;
//注: 上面两个操作都可以在设计时. //其实如果在 Head 中链接 js 或 css 应该使用 ContentFiles, 上面的嵌入方法跟适于...譬如:
procedure TIWServerController.IWServerControllerBaseCreate(Sender: TObject);
begin
HTMLHeaders.Add('<meta name="Keywords" content="万一,Delphi,IntraWeb"/>'); //指定搜索关键字
end;

2.2 - 使用 ContentFiles 方法链接 js 或 css


{站点级 - ServerController.pas}
procedure TIWServerController.IWServerControllerBaseCreate(Sender: TObject);
begin
ContentFiles.Add('My1.js'); //内链, 文件位于 wwwroot; 当然也可以外链
end; {页面级 - Unit1.pas}
procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
ContentFiles.Add('My2.js'); //内链, 文件位于 wwwroot; 当然也可以外链
ContentFiles.Add('MyJs/My3.js'); //内链 wwwroot/MyJs/My3.js
end; //ContentFiles 会自动转换为 Html 需要的格式, 所以很方便

2.3 - 使用 PageContext 的方法


procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
PageContext.PreScriptFiles.Add('My4.js');
PageContext.AddScriptFile('My5.js');
end;

2.4 - 把 js 嵌入到资源文件, 并调用


先从 Project > Resources and Images... 把一个 js 添加到资源文件:

这个主要是 IW 内部使用的, 其规则很玄妙. 作为 JS 资源必须是 IW_JS_ 开头, 好像对使用的字符也有限制.

另外这个资源编辑器, 从出生到现在都有点小问题, 重新打开随便点点就好了.

{下面是调用代码:}
uses IWServerInternalFiles; //为使用 gInternalFiles {从资源中提取 js; 如果不仅仅是该页使用, 应该是从 ServerController 单元}
procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
gInternalFiles.Add('IW_JS_MyJS', '/js/MyJS.js'); //第一个参数资源文件名;
//第二个参数是目的(内部临时文件名), 必须是 /js/xxx.js (好像 xxx 也要求和资源文件的定义同名)
{启用从资源提取的 js}
PageContext.ScriptFiles.Add('/js/MyJS.js');
end;

3.1 - IW 给控件在 Html 中的重命名规则


//规则是 "控件名"(转大写) + "IWCL"

//假如点击 IWButton1 给 IWMemo1 输入内容:
procedure TIWForm1.IWButton1Click(Sender: TObject);
begin
IWMemo1.Text := 'Delphi Hi';
end; //但这要通过 js 实现应该是:
procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
IWButton1.ScriptEvents.Values['onclick'] := 'IWMEMO1IWCL.value = "Js Hi"';
end;

3.2 - 解决冲突


procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
IWButton1.ScriptEvents.Values['onclick'] := 'alert(1)'; //如果是这样, 哪下面的 IWButton1.OnClick 就不会执行了
// IWButton1.ScriptEvents.Values['onclick'] := 'alert(1); return true;'; //返回(真)一下就好了
end; procedure TIWForm1.IWButton1Click(Sender: TObject);
begin
WebApplication.ShowMessage('2');
end;

3.3 - 使用 ScriptEvents 的 Add() 与 HookEvent() 方法添加 js 代码


procedure TIWForm1.IWAppFormCreate(Sender: TObject);
begin
JavaScript.Text := 'function JsFun1(obj) { alert(obj.id); }'; IWButton1.ScriptEvents.HookEvent('onclick', 'JsFun1(this)');
IWLabel1.ScriptEvents.HookEvent('onclick', 'JsFun1(this)'); IWButton2.ScriptEvents.HookEvent('onclick', 'alert(this.id);'); IWButton3.ScriptEvents.Add('onclick').EventCode.Text := 'alert(this.id);';
end;

IW 还有相关调试的内容, 好的 js 编辑与调试工具太多了, 没必要使用 IW 写 js 或调试.


使用 IntraWeb (9) - JavaScript的更多相关文章

  1. Delphi XE7 开发ActiveX 及在IntraWeb下调试

    最近学习DelphiXE7下Intraweb开发,Intraweb完全服务器端运行使得FastReport报表系统无法在客户端运行,当然网上也有一大堆解决方案,例如导出到PDF后,给出连接,让客户点击 ...

  2. JavaScript之父Brendan Eich,Clojure 创建者Rich Hickey,Python创建者Van Rossum等编程大牛对程序员的职业建议

    软件开发是现时很火的职业.据美国劳动局发布的一项统计数据显示,从2014年至2024年,美国就业市场对开发人员的需求量将增长17%,而这个增长率比起所有职业的平均需求量高出了7%.很多人年轻人会选择编 ...

  3. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  4. Javascript 的执行环境(execution context)和作用域(scope)及垃圾回收

    执行环境有全局执行环境和函数执行环境之分,每次进入一个新执行环境,都会创建一个搜索变量和函数的作用域链.函数的局部环境不仅有权访问函数作用于中的变量,而且可以访问其外部环境,直到全局环境.全局执行环境 ...

  5. 探究javascript对象和数组的异同,及函数变量缓存技巧

    javascript中最经典也最受非议的一句话就是:javascript中一切皆是对象.这篇重点要提到的,就是任何jser都不陌生的Object和Array. 有段时间曾经很诧异,到底两种数据类型用来 ...

  6. 读书笔记:JavaScript DOM 编程艺术(第二版)

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  7. 《Web 前端面试指南》1、JavaScript 闭包深入浅出

    闭包是什么? 闭包是内部函数可以访问外部函数的变量.它可以访问三个作用域:首先可以访问自己的作用域(也就是定义在大括号内的变量),它也能访问外部函数的变量,和它能访问全局变量. 内部函数不仅可以访问外 ...

  8. JavaScript权威指南 - 函数

    函数本身就是一段JavaScript代码,定义一次但可能被调用任意次.如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法.用于初始化一个新创建的对象的函数被称作构造函数. 相对 ...

  9. JavaScript自定义浏览器滚动条兼容IE、 火狐和chrome

    今天为大家分享一下我自己制作的浏览器滚动条,我们知道用css来自定义滚动条也是挺好的方式,css虽然能够改变chrome浏览器的滚动条样式可以自定义,css也能够改变IE浏览器滚动条的颜色.但是css ...

随机推荐

  1. unp的hello word

    最近无聊,再学学unp吧.学学网络编程.下面是一个demo: intro/daytimetcpcli.c #include "unp.h" int main(int argc, c ...

  2. 线性筛的同时得到欧拉函数 (KuangBin板子)

    线性筛的思想:每个被筛的数是通过它最小的质因子所筛去的. 这种思想保证了每个数只会被筛一次,从而达到线性.并且,这个思想实现起来非常巧妙(见代码注释)! 因为线性筛的操作中用到了倍数的关系去实现,因此 ...

  3. 由于找不到MSVCP20.dll,无法继续执行代码

    系统:win10 专业版,刚升级win10没几天 mysql 5.7.21 解压安装,初始化时报错,错误如图: 一.查找错误原因 参考:MySQL安装使用遇到的问题, 找到微软中文官方网站,搜索 ms ...

  4. 【配置】Spring和MyBatis整合

    spring配置文件: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="h ...

  5. Spring Boot 多模块项目创建与配置 (一)

    最近在负责的是一个比较复杂项目,模块很多,代码中的二级模块就有9个,部分二级模块下面还分了多个模块.代码中的多模块是用maven管理的,每个模块都使用spring boot框架.之前有零零散散学过一些 ...

  6. Linux硬盘的检测(原创)

    http://czmmiao.iteye.com/blog/1058215 概述 随着硬盘容量.速度的快速发展,硬盘的可靠性问题越来越重要,今天的单块硬盘存储容量可轻松达到1TB,硬盘损坏带来的影响非 ...

  7. activiti主要组件解析

    Activiti内部实现中,各主要部件关系 对外,提供Service服务,它是无状态的. 这些Service包括: protected RepositoryService repositoryServ ...

  8. activiti流程跟踪图算法

    流程跟踪图-推导算法 工作中使用activiti实现流程图相关业务,但是上线后遇到问题,偶尔流程图出不来.查阅了一下画流程图的实现,基本上是参见:activiti-流程图颜色变化之一篇. 核心类,参见 ...

  9. .NetCore下使用Prometheus实现系统监控和警报 (三)集成Grafana

    有了前面InfluxDB的经验,这里就很好处理了,数据类型选择Prometheus选地址等,填好保存 同样通过导入数据处理,我们在https://grafana.com/dashboards上选择Da ...

  10. k8s中新建一个namespace和harborsecret的yaml文件

    注意哟, 不同的harborsecret,在不同的namespace中,是不共用的. 也就是说,如果在default名字空间中,创建了一个docker login secret, 在其它名字空间中,是 ...