QT通过JS与HTML的交互

头文件加入

QT       += core gui webenginewidgets webchannel

通过QWebChannel与JS交互原理

   QWebEnginePage *page = new QWebEnginePage(this);     webView->setPage(page);     webView->load(QUrl("qrc:/html/index.html"));     webView->show();     QWebChannel *channel = new QWebChannel(this);     //注册一个content  这里的内容通过JS的content来获取     channel->registerObject(QString("content"),this);     page->setWebChannel(channel);

注意：一定要先给WebView设置page，在加载网页，否则网页出不来！

QT发送信息到JS：

signals:     void sendText(const QString &s_user,const QString &s_pwd); //点击按钮 设置发送的文本 void MainWindow::callJSBtnClicked() {     //emit sendText(user->text(),password->text());     sendText(user->text(),password->text());     user->setText("");     password->setText(""); }

QT接收到JS的信息

public slots:     void receiveText(const QString &r_user,const QString &r_pwd);  void MainWindow::receiveText(const QString &r_user, const QString &r_pwd) {     user->setText(r_user);     password->setText(r_pwd); }

JS中对信息的操作

window.onload = function () {     new QWebChannel(qt.webChannelTransport,function (channel) {         var content = channel.objects.content;         //接收QT发送来的         content.sendText.connect(function (s_user, s_pwd) {             document.getElementById("userName").value = s_user;             document.getElementById("userPwd").value = s_pwd;         })         //传给QT         document.getElementById("submit").onclick = function () {                var userName = document.getElementById("userName").value;                var userPwd = document.getElementById("userPwd").value;                document.getElementById("userName").value = "";                document.getElementById("userPwd").value = "";                content.receiveText(userName,userPwd);         }     }) }

在MainWindow中关闭连接

MainWindow::~MainWindow() {     this->disconnect(); }