如何让 javascript 在调用 QWebElement.appendInside('some html code') 中工作？答案

【问题标题】：How to get javascript working in call QWebElement.appendInside('some html code')?如何让 javascript 在调用 QWebElement.appendInside('some html code') 中工作？
【发布时间】：2012-10-12 08:14:59
【问题描述】：

我正在为即时通讯客户端开发插件，该插件将在 QWebView 中显示聊天日志。插件必须支持 html 模板。现在我正在尝试通过调用 QWebElement.appendInside('new message') 来附加新消息，如果模板中有 javascript 源它不起作用。例如模板可能是这样的类型：

<!--MessageIn-->
<div class="space">&nbsp;</div>
<div class="in MessageIn" id="oneShot">
    <div class="tr">
        <div class="bl">
            <div class="br">
                <p class="head">
                    <span class="time" id="time">%time%</span>
                    <span class="name" id="name">%name%</span>
                </p>
                <p class="content">
                    <span class="text" id="text"><script>getitall('%text%','%name%','%cid%','%base%',meldungsart[0]);</script></span>
                </p>                    
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">animation1();</script>

函数 getitall() 和 animation1() 不会被执行。

我不能使用 QWebElement.evaluatejavascript() 因为我不知道函数名。

【问题讨论】：

您可以在模板中搜索节点，然后读取其内容并进行评估。
evaluatejavascript() 还有一个问题：如果 document.write() 用在 JavaScript 函数中（在模板中），那么结果它将替换整个 DOM。
这是我的错误。 document.write 方法不应在加载的页面中使用。 evaluateJavaScript 是合适的。
但有些模板仍然无法正常工作，因为在向 DOM 添加新元素之前必须调用一些 JavaScript 函数。
所以我的问题仍然没有解决方案

标签： javascript qt dom webkit

【解决方案1】：

解决方案是使用 JQuery。看这个例子

//QString add contains block of HTML code

QWebElement bodyElem = webView->page()->mainFrame()->documentElement().findFirst("body");
add = "var $bodyy=$('body');"
+ "$bodyy.append('" + add + "');"
+ "null;";
bodyElem.evaluateJavaScript(add);

【讨论】：

【解决方案2】：

我试过了，这个代码可以工作：

//main.cpp:
#include <QtGui/QApplication>
#include "mainwindow.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();

    return a.exec();
}

//mainwindow.h:
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H


//mainwindow.cpp:
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QtWebKit/QWebElement>
#include <QtWebKit/QWebPage>
#include <QtWebKit/QWebFrame>
#include <QDebug>

MainWindow::~MainWindow()
{
    delete ui;
}

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    QString str="<div class=\"space\">&nbsp;</div>"
                "   <div class=\"in MessageIn\" id=\"oneShot\">"
                "      <div class=\"tr\">"
                "         <div class=\"bl\">"
                "            <div class=\"br\">"
                "               <p class=\"head\">"
                "                  <span class=\"time\" id=\"time\">%time%</span>"
                "                  <span class=\"name\" id=\"name\">%name%</span>"
                "               </p>"
                "               <p class=\"content\">"
                "                  <span class=\"text\" id=\"text\">    <script>getitall('%text%','%name%','%cid%','%base%',meldungsart[0]);</script></span>"
                "               </p>"
                "            </div>"
                "         </div>"
                "      </div>"
                "   </div>";
    QWebPage *page = new QWebPage(this);
    ui->webView->setPage(page);
    QWebFrame *frame = page->mainFrame();
    frame->setHtml("<html><head><script type=\"text/javascript\">function displayDate(){     document.getElementById(\"time\").innerHTML=Date(); }</script></head><body><p>First     Paragraph</p><p>Second Paragraph</p><div id=\"void\">void</div></body></html>");
    QWebElement voiddiv = frame->findFirstElement("div#void");
    voiddiv.setInnerXml(str);
    voiddiv.evaluateJavaScript("displayDate();");
}


//mainwindow.ui:
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QMainWindow" name="MainWindow">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>400</width>
    <height>300</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralWidget">
   <layout class="QVBoxLayout" name="verticalLayout">
    <item>
     <widget class="QWebView" name="webView">
      <property name="url">
       <url>
        <string>about:blank</string>
       </url>
      </property>
     </widget>
    </item>
   </layout>
  </widget>
  <widget class="QMenuBar" name="menuBar">
   <property name="geometry">
    <rect>
     <x>0</x>
     <y>0</y>
     <width>400</width>
     <height>18</height>
    </rect>
   </property>
  </widget>
  <widget class="QToolBar" name="mainToolBar">
   <attribute name="toolBarArea">
    <enum>TopToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
  </widget>
  <widget class="QStatusBar" name="statusBar"/>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <customwidgets>
  <customwidget>
   <class>QWebView</class>
   <extends>QWidget</extends>
   <header>QtWebKit/QWebView</header>
  </customwidget>
 </customwidgets>
 <resources/>
 <connections/>
</ui>

//pro file:
QT       += core gui webkit

TARGET   = QWebViewTest
TEMPLATE = app


SOURCES +=  main.cpp\
            mainwindow.cpp

HEADERS  += mainwindow.h

FORMS    += mainwindow.ui

如您所见，我创建了自己的 javascript 函数，并使用它来测试代码。该方法应该与任何 javascript 方法相同。因此，您应该自定义您的 javascript 和 (x)html/xml 代码以获得您所需要的。但这应该是一个很好的起点；）

【讨论】：

正如我在第一条消息中所说，由于某些原因，我无法使用 evaluatejavascript。首先，因为我不知道 JS 函数的名称，不，我不想在整个模板片段中搜索它们。