天天看点
返回

PyQT5 （六十五） PyQt5 调用 Javascript代码 的案例 PyQt5 和 Javascript 交互

PyQT5 （六十五） PyQt5 调用 Javascript代码 的案例 PyQt5 和 Javascript 交互

 PyQt5 调用 Javascript代码 的案例

PyQt5 和 Javascript 交互

什么叫交互

互相调用

PyQt5 <--> Javascript

tt.html

<!doctype html>
<html >
<head>
    <meta charset="UTF-8">
    <title>测试JS表单页面</title>
    <script>
        function fullname(value){
            alert('<'+value+'>');
            var firstname = document.getElementById('firstname').value;
            var lastname = document.getElementById('lastname').value;
            var fullname = firstname + ' '+lastname;
            document.getElementById('fullname').value = fullname;
            document.getElementById('submit_btn').style.display = 'block';
            return fullname;
        }
    </script>
</head>
<body>
<h1>测试JS表单</h1>
<form action="get">
    <label for="firstname">姓:</label>
    <input type="text" name="firstname" id="firstname"/>
    <br>
    <label for="lastname">名:</label>
    <input type="text" name="lastname" id="lastname"/>
    <br>
    <label for="fullname">姓名:</label>
    <input type="text" name="fullname" id="fullname"/>
    <br>
    <input type="submit" id="submit_btn" style="display:none;">
</form>

</body>
</html>
           
import os
import sys

from PyQt5.QtCore import QUrl
from PyQt5.QtGui import QIcon
from PyQt5.QtWebEngineWidgets import QWebEngineView
from PyQt5.QtWidgets import QMainWindow, QHBoxLayout, QPushButton, QMessageBox, QApplication, QVBoxLayout, QWidget

'''
PyQt5 调用 Javascript代码 的案例
PyQt5 和 Javascript 交互
什么叫交互
互相调用
PyQt5 <--> Javascript

'''

class PyQtCallJSDemo(QWidget):

    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        # 设置定位和左上角坐标
        self.setGeometry(300, 300, 360, 260)
        # 设置窗口标题
        self.setWindowTitle('PyQt5 调用 Javascript代码 的演示')
        # 设置窗口图标
        # self.setWindowIcon(QIcon('../web.ico'))

        self.layout = QVBoxLayout()
        self.browser = QWebEngineView()
        url = os.getcwd()+'/tt.html'
        # print(url)
        self.browser.load(QUrl.fromLocalFile(url))
        # self.setCentralWidget(self.browser)
        self.layout.addWidget(self.browser)

        button = QPushButton('设置全名')
        button.clicked.connect(self.fullname)
        self.layout.addWidget(button)
        self.setLayout(self.layout)

    # 用于获取返回值的回调函数
    def js_callback(self,result):
        print(result)

    # 执行js的函数,传参数,并获取返回值
    def fullname(self):
        self.value = '李 成龙'
        self.browser.page().runJavaScript('fullname("'+self.value+'");',self.js_callback)



if __name__ == '__main__':
    app = QApplication(sys.argv)
    # 设置应用图标
    app.setWindowIcon(QIcon('../web.ico'))
    w = PyQtCallJSDemo()
    w.show()
    sys.exit(app.exec_())
pyqt5 Qt javascript 交互 Python
上一篇: 学习二 Qt creator中的基本组件（一）
下一篇: python pyqt5、pyqt5 tools安装失败安装pyqt5失败

继续阅读