delphi给js传参

在Delphi中给JavaScript传递参数可以通过多种方式实现，以下是一些常见的方法：

1、通过URL参数传递

原理：在Delphi中构建包含参数的URL，然后在JavaScript中通过解析URL来获取这些参数。

示例：假设在Delphi代码中有一个按钮点击事件，点击后打开一个网页并传递参数。

Delphi代码

“`delphi

procedure TForm1.Button1Click(Sender: TObject);

var

URL: string;

begin

URL := ‘file:///path/to/your/htmlfile.html?param1=value1&param2=value2’;

TWebBrowser1.Navigate(URL);

end;

JavaScript代码
     ```javascript
       window.onload = function() {
         var urlParams = new URLSearchParams(window.location.search);
         var param1 = urlParams.get('param1');
         var param2 = urlParams.get('param2');
         console.log('param1:', param1); // 输出 value1
         console.log('param2:', param2); // 输出 value2
       };

2、通过全局变量传递

原理：在Delphi中创建一个全局变量，并在适当的时候将其值赋给该变量，然后在JavaScript中访问这个全局变量。

示例：在Delphi项目中创建一个单元文件，定义一个全局变量。

Delphi代码（GlobalVars.pas）

“`delphi

unit GlobalVars;

interface

var

GlobalParam: string;

implementation

end.

在主程序中使用
     ```delphi
       uses
         GlobalVars;
       ...
       procedure TForm1.Button1Click(Sender: TObject);
       begin
         GlobalParam := 'Hello from Delphi';
         TWebBrowser1.Navigate('file:///path/to/your/htmlfile.html');
       end;

JavaScript代码

“`javascript

window.onload = function() {

var delphiParam = window.external.GlobalParam;

console.log(‘Delphi parameter:’, delphiParam); // 输出 Hello from Delphi

};

注意事项：这种方法需要确保Delphi应用程序和JavaScript运行在同一个安全上下文中，并且可能需要进行一些安全设置才能允许JavaScript访问Delphi的全局变量。
3、通过DOM元素传递原理：在Delphi中操作HTML文档的DOM元素，将参数存储在DOM元素的属性或内容中，然后JavaScript可以读取这些DOM元素来获取参数。示例：在Delphi中向一个隐藏的<input>元素写入参数值。Delphi代码
     ```delphi
       procedure TForm1.Button1Click(Sender: TObject);
       begin
         TWebBrowser1.NavigateComplete2(procedure(Sender: TObject; const pDisp: IDispatch; var URL: OleVariant)
           var
             doc: IHTMLDocument2;
             inputElem: IHTMLElement;
           begin
             doc := TWebBrowser1.Document as IHTMLDocument2;
             inputElem := doc.createElement('input');
             inputElem.type_ := 'hidden';
             inputElem.id := 'delphiParam';
             inputElem.value := 'Hello from Delphi';
             doc.body.appendChild(inputElem);
           end);
       end;

JavaScript代码

“`javascript

window.onload = function() {

var inputElem = document.getElementById(‘delphiParam’);

var delphiParam = inputElem.value;

console.log(‘Delphi parameter:’, delphiParam); // 输出 Hello from Delphi

};

4、通过回调函数传递原理：在Delphi中定义一个回调函数，并将其传递给JavaScript，JavaScript在需要的时候调用这个回调函数，并将参数传递给它。示例：在Delphi中创建一个回调函数，并将其注册到JavaScript中。Delphi代码
     ```delphi
       procedure TForm1.Button1Click(Sender: TObject);
       begin
         TWebBrowser1.NavigateComplete2(procedure(Sender: TObject; const pDisp: IDispatch; var URL: OleVariant)
           var
             doc: IHTMLDocument2;
           begin
             doc := TWebBrowser1.Document as IHTMLDocument2;
             doc.parentWindow.execScript('var delphiCallback = function(param){alert("Delphi callback called with: " + param);}', 'JavaScript');
           end);
       end;

JavaScript代码

“`javascript

function callDelphiCallback(param) {

window.external.delphiCallback(param);

}

callDelphiCallback(‘Hello from JavaScript’);

注意事项：这种方法需要确保Delphi应用程序能够正确处理JavaScript传递过来的参数，并且需要进行一些安全设置以允许Delphi和JavaScript之间的交互。
在实际开发中，选择合适的传参方法取决于具体的应用场景和需求，需要注意不同方法的安全性和兼容性问题，以确保数据的正确传递和应用程序的稳定运行。