QT 和AS交互

本文介绍如何在Qt中使用webView加载本地HTML文件,并通过设置信号槽机制实现Qt与JavaScript之间的交互。具体步骤包括设置webView的URL、连接信号与槽以清除JavaScript窗口对象并填充自定义对象。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、ui->webView->setUrl( QUrl(" url:/form.html" ) );

2、connect( ui->webView->page()->mainFrame(), SIGNAL( javaScriptWindowObjectCleared() , this , SLOT( populateJavaScriptWindowObject() )) );

3、

populateJavaScriptWindowObject() 
{
    ui->webView->page->mainWindow->addToJavaScriptWindowObject( "mainwindow", this );
}
4、html中引用QT中方法: mainwindow::func();

### QT与前端交互的方式 #### 使用 QWebEngineView JavaScript 进行基本交互 通过 `QWebEngineView` 可以加载并显示 HTML 页面,并允许 Python 代码执行页面中的 JavaScript 脚本。对于 PySide 或 PyQt 应用程序来说,这种集成方式非常方便。 ```python from PySide6.QtWidgets import QApplication, QVBoxLayout, QWidget from PySide6.QtCore import Slot from PySide6.QtWebEngineWidgets import QWebEngineView import sys class WebPage(QWidget): def __init__(self): super().__init__() self.browser = QWebEngineView() layout = QVBoxLayout(self) layout.addWidget(self.browser) with open('index.html', 'r') as file: html_content = file.read() self.browser.setHtml(html_content) if __name__ == '__main__': app = QApplication(sys.argv) window = WebPage() window.show() sys.exit(app.exec()) ``` 此段代码展示了如何读取本地HTML文件并通过 `setHtml()` 方法将其设置到 `QWebEngineView` 中[^1]。 #### 利用 QWebChannel 实现更复杂的双向通信 为了实现更加复杂的功能,比如从JavaScript端触发Python方法调用,则可以借助于 `QWebChannel` 。这使得可以在浏览器环境下的JavaScript同Qt对象之间建立桥梁,从而支持事件监听器注册、属性获取等功能。 ```javascript // index.html 内部脚本部分 new QWebChannel(qt.webChannelTransport, function(channel) { var dialog = channel.objects.dialog; document.getElementById("button").addEventListener("click", function() { console.log(dialog.message()); // 调用了 C++/Python 的 slot 函数 message(). }); }); ``` 上述片段说明了当点击按钮时会向 Qt 发送请求去执行某个特定的操作[^2]。 #### 完整示例结构 整个项目通常由三部分组成: - **main.py**: 主应用程序入口点; - **dialog.py** (或相应的 .ui 文件): 定义UI组件及其行为逻辑; - **index.html**: 前端界面设计文档; 这些组成部分共同作用实现了完整的QT与前端之间的互动体验。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值