无法使JavaScript在WebView中工作 [英] Can''t get JavaScript to work in WebView

问题描述

我有一个相当简单的JavaFX应用程序.它有一个窗口，分为两个窗口.左侧是一个表视图，其中列出了数据库中的行.选择其中一行时，它会在右侧的Web视图中显示XML(也来自数据库).到目前为止，一切都很好.我一辈子都无法使用任何JavaScipt.我的最终目标是进行搜索并突出显示工作方式(如

I have a fairly simple JavaFX application. It has one window, split in two. On the left is a tableview that lists rows from a database. When you select one of the rows, it displays the XML (also from the database) in a webview on the right. So far so good. I can't for the life of me get any sort of JavaScipt working. My ultimate goal is to get a search and highlight working (as in this great post. Based on my problems there, I thought I'd try and simplify matters by just plugging in a simple JavaScript function to the HTML.

如果相关，我正在使用FXML.我有一个按钮，因为它是OnAction属性，所以调用此方法:

I'm using FXML, if that's relevant. I have a button that for it's OnAction property, calls this method:

    @FXML
    private void searchBrowser() {
        if (webEngine.getDocument() != null) {
            highlight(searchField.getText());           
        } 
    }

    @FXML
    private void highlight(String text) {
        webEngine.executeScript("test()");

它不会引发任何错误，并且两个方法都按顺序调用.只是没有其他事情发生. test()函数位于HTML中，只是一个简单的警报.如果我只保存HTML并将其加载到Chrome或IE中，该功能就可以正常工作. 我在做什么错了?

It doesn't throw any errors, and both methods are called in order. Just nothing else happens. The test() function is in the HTML, just a simple alert. If I just save the HTML and load it in Chrome or IE, the function works fine. What am I doing wrong?

推荐答案

首先，我找不到简单的方法来修复webView.getEngine().loadContent();的旧版本.

First of all I can't find easy way to fix old version for webView.getEngine().loadContent();.

但是我决定在项目中使用相同的功能.我的要求是语法突出显示和选定的文本突出显示，所以这是我想到的:(代码并未真正优化，只是可以工作并演示了如何做到)

But i decided to push the same feature on my project. My requirements where syntactic highlight and selected text highlight, so here is what i came up with: (Code is not really optimised, just works and demonstrates how it can be done)

这是1个帖子的巨大代码，所以我将解释必要的部分并发布git演示链接. Java git路径.，

It is huge code for 1 post ,so i will just explain essential parts and post demo git link. Java git path., Resources git path

• 用于突出显示语法的Google-code-prettify库
• JQuery + 2个js函数用于选中的文本突出显示.
• 最初我将template HTML文件作为字符串加载并修复CSS和JS 链接，因为我将它们存储在本地并且不知道如何在html中设置相对路径
• 然后我将html encoded XML包装在HTML模板中

• Google-code-prettify lib for syntactic highlight
• JQuery + 2 js functions for selected text highlight.
• Initially I load template HTML file as a string and fix css and js links, because i store them locally and have no idea how to setup relative path in html
• Then I wrap html encoded XML in template HTML

旧帖子仅适用于webView.getEngine().load():

Old Post works only for webView.getEngine().load():

我不知道test() js函数的内容，但是这段代码看起来 对我很好.问题可能出在将js附加到页面上时， 因为webView.getEngine().load()和 webView.getEngine().loadContent();都是异步任务，因此您 必须像这样添加侦听器:

I don't know what's inside test() js function, but this code looks fine to me. The problem can be when you append your js to the page, because webView.getEngine().load() and webView.getEngine().loadContent(); are both assync tasks, so you have to add listener like this:

webView.getEngine().getLoadWorker().stateProperty().addListener(
            new ChangeListener<Worker.State>() {
                public void changed(ObservableValue ov, 
                                    Worker.State oldState, Worker.State newState) {
                    if (newState == Worker.State.SUCCEEDED) {
                        //some append js code here
                    }
                }
            });

这是工作示例代码: https://gist.github.com/varren/1fb41536f2b95f69be4e

And here is working demo code: https://gist.github.com/varren/1fb41536f2b95f69be4e

这篇关于无法使JavaScript在WebView中工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！