如何从 JavaFX 中的 HTML webview 中检索组件答案

【问题标题】：How to retrieve components from HTML webview in JavaFX如何从 JavaFX 中的 HTML webview 中检索组件
【发布时间】：2016-05-18 17:41:35
【问题描述】：

目前我有一个WebView 显示一个简单的index.html，这个WebView 是在FXMLDocument.fxml 中创建并在FXMLDocumentController.java 中控制的。
如果我在index.html 中有一个按钮，我如何检索它或访问它以使其使用java 执行某些操作？有没有一种动作处理程序来做这些事情？

FXMLDocuement.fxml：

    <?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.web.*?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="510.0" prefWidth="794.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafxapplication1.FXMLDocumentController">
    <children>
        <Button fx:id="button" layoutY="471.0" onAction="#handleButtonAction" text="Click Me!" />
        <Label fx:id="label" layoutX="126" layoutY="120" minHeight="16" minWidth="69" />
      <WebView id="WebView1" fx:id="WebView1" layoutY="5.0" prefHeight="444.0" prefWidth="882.0" />
      <Label id="lbl1" fx:id="lbl1" layoutX="88.0" layoutY="475.0" prefHeight="17.0" prefWidth="99.0" text="Label" />
    </children>
</AnchorPane>

FXMLDocumentController.java：

package javafxapplication1;

import java.io.File;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.ResourceBundle;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Label;
import javafx.scene.web.WebView;

public class FXMLDocumentController implements Initializable {

    @FXML
    private Label label;

    @FXML
    private WebView WebView1;

    @FXML
    private Label lbl1;

    @FXML
    private void handleButtonAction(ActionEvent event) throws MalformedURLException {
        System.out.println("You clicked me!");
        label.setText("Hello World!");
        lbl1.setText("Bonjour");

        WebView1.getEngine().load(new File("C:/Users/hadhe/Desktop/boots/index.html").toURI().toURL().toString());
    }

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }    

}

包含main的类：JavaFXApplication1.java：

package javafxapplication1;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class JavaFXApplication1 extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));

        Scene scene = new Scene(root);

        stage.setScene(scene);
        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

【问题讨论】：

标签： java templates javafx webview

【解决方案1】：

HTML 文档在 WebEngine 的 document 属性中，但它是在后台加载的，所以您必须等待它加载：

WebView1.getEngine().documentProperty().addListener((o, old, doc) -> listenToButton(doc));
WebView1.getEngine().load(new File("C:/Users/hadhe/Desktop/boots/index.html").toURI().toURL().toString());

文档对象是一个普通的 XML 文档，所以如果按钮有一个id 属性，你可以很容易地检索它：

private void listenToButton(Document doc) {
    if (doc == null) {
        return;
    }

    String id = "app-action-button";
    Element button = doc.getElementById(id);

    // ...
}

如果按钮没有 id，你可以使用 XPath 搜索它：

private void listenToButton(Document doc) {
    if (doc == null) {
        return;
    }

    XPath xpath = XPathFactory.newInstance().newXPath();
    Element button = (Element)
        xpath.evaluate("//input[type='button']", doc,
            XPathConstants.NODE);

    // ...
}

最后，您可以为按钮添加一个 DOM 事件侦听器，如WebEngine documentation 中所述：

((EventTarget) button).addEventListener("click", e -> doSomeAction(), false);

【讨论】：

【解决方案2】：

【讨论】：

这应该是评论，而不是答案。