Question

在标题中，我需要在jfx webview中包含jquery。到目前为止我可以包括资源文件夹中的css样式表，顺便说一下我的应用程序正在摆动，但是使用javafx的webview来获得更好的css支持，因为swing中的jtextpane不支持很多css。

Answer 1

我喜欢这个想法Stephen Katulka's，如果斯蒂芬的方法适合你，这可能是一个更好的答案。

更新：我刚刚查看了shankar's answer中的链接，其代码与此答案中包含的示例代码相同。

我使用下面的函数在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 + "});"
  );
}

该函数源自此sample gist，将jQuery注入到加载到WebView中的文档中。

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

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

Answer 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。如果您的应用程序在互联网上，那么从Google加载jQuery要好得多，因为这意味着如果它已经在前一页上加载，则不必再次加载它。如果您的应用是内部网或封闭式沙箱，则无需担心这些问题。

Answer 3

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

我认为你的想法唯一的问题是JQuery需要一个cdn。因此，如果您将JQuery包含在HTML文档中，那么请确保包含JQuery的CDN，然后您可以使用带有HTML文件链接的load方法。

Answer 4

我已经尝试过这些解决方案-它们可以工作，但是它们很棘手-而且很丑。

如果您的环境是您从javafx程序中以html文本的形式加载页面，而又不想访问Internet，则创建包含jquery.min.js代码的资源（html文件）。您只需连接html文件。这样，jquery将按预期的方式运行，从而将页面加载到webview中。

如何在javafx webview中包含jquery？

4 个答案: