1

如标题所示,我需要在 jfx webview 中包含 jquery。到目前为止,我可以从资源文件夹中包含一个 css 样式表,顺便说一下我的应用程序是 swing,但是使用 javafx 中的 webview 以获得更好的 css 支持,因为 swing 中的 jtextpane 不支持太多 css。

4

4 回答 4

3

我确实喜欢斯蒂芬卡图尔卡的回答这个想法,如果斯蒂芬的方法适合你,那可能是一个更好的答案。


更新:我刚刚查看了shankar 答案中的链接,那里的代码与此答案中包含的示例代码相同。


我使用下面的函数在 WebView 中使用 jQuery:

/**
 * Executes a script which may reference jQuery function on a document.
 * Checks if the document loaded in a webEngine has a version of jQuery corresponding to 
 * the minimum required version loaded, and, if not, then loads jQuery into the document 
 * from the default JQUERY_LOCATION.
 * @param engine the webView engine to be used.
 * @Param jQueryLocation the location of the jQuery script to be executed.
 * @param minVersion the minimum version of jQuery which needs to be included in the document.
 * @param script provided javascript script string (which may include use of jQuery functions on the document).
 * @return the result of the script execution.
 */ 
private static Object executejQuery(final WebEngine engine, String minVersion, String jQueryLocation, String script) {
  return engine.executeScript(
    "(function(window, document, version, callback) { "
      + "var j, d;"
      + "var loaded = false;"
      + "if (!(j = window.jQuery) || version > j.fn.jquery || callback(j, loaded)) {"
      + "  var script = document.createElement(\"script\");"
      + "  script.type = \"text/javascript\";"
      + "  script.src = \"" + jQueryLocation + "\";"
      + "  script.onload = script.onreadystatechange = function() {"
      + "    if (!loaded && (!(d = this.readyState) || d == \"loaded\" || d == \"complete\")) {"
      + "      callback((j = window.jQuery).noConflict(1), loaded = true);"
      + "      j(script).remove();"
      + "    }"
      + "  };"
      + "  document.documentElement.childNodes[0].appendChild(script) "
      + "} "
      + "})(window, document, \"" + minVersion + "\", function($, jquery_loaded) {" + script + "});"
  );
}

该函数源自此示例要点,用于将 jQuery 注入到加载到 WebView 中的文档中。

注意,该函数需要在执行脚本注入jQuery之前将文档加载到WebView中。您可以通过向 WebEngine 的文档属性添加监听器并仅在设置文档后触发注入 jQuery 的函数来确保文档已加载。


您还可以直接在加载的 html 中包含 jQuery 引用,而不是注入它们。直接包含技术的一个示例是在 JavaFX WebView 屏幕中显示jQuery DatePicker的示例。

于 2013-11-28T00:13:04.760 回答
2

只需从资源中将脚本作为字符串加载,然后调用 WebEngine 的 executeScript() 命令来运行它:

WebView browser;
StringBuilder jQueryContents = new StringBuilder; 
        // load this string with your jQuery file contents

BufferedReader reader = new BufferedReader(new InputStreamReader(
        App.class.getResourceAsStream("/jquery.min.js")));

String line = reader.readLine();

while (line != null){
    jQueryContents.append(line);
    line = reader.readLine();
}

JSObject jQuery = null;
try{
    jQuery = (JSObject) browser.getEngine().executeScript("$");
}catch (JSException jse){}

if (jQuery == null){ // Don't load jQuery if there already is one, or you
                     // will destroy any $(document).ready() handlers that
                     // were declared previously
    browser.getEngine().executeScript(jQueryContents.toString());
}    

然后你的引擎已经加载了 jQuery。如果您的应用程序在 Internet 上,最好从 Google 加载 jQuery,因为这意味着如果它已经在前一页上加载过,则不必再次加载它。如果你的应用是内网或封闭沙箱,你不必担心这些事情。

于 2013-11-27T23:19:08.320 回答
0

JavaFX 确实支持 JQuery,如果您启用了 JavaScript,唯一不起作用的是 JQuery mobile,因为主题滚轮 JRE 出于某种原因无法读取 CSS-UI 控制器。记住 JQuery 仍然是 JavaScript。

我看到你的想法的唯一问题是 JQuery 需要一个 CDN。因此,如果您将 JQuery 包含到 HTML 文档中,请确保包含 JQuery 的 CDN,然后您可以使用带有指向 HTML 文件的链接的加载方法。

于 2016-02-17T03:02:13.420 回答
0

我已经尝试过这些解决方案——它们有效,但它们很棘手——而且丑陋。

如果您的环境是从 javafx 程序将页面加载为 html-text 并且您不想访问 Internet,则创建一个包含 jquery.min.js 代码的资源(html 文件)。您只需连接 html 文件。这样,jquery 将按预期运行,在 webview 中加载页面。

于 2019-01-24T14:33:32.150 回答