如标题所示,我需要在 jfx webview 中包含 jquery。到目前为止,我可以从资源文件夹中包含一个 css 样式表,顺便说一下我的应用程序是 swing,但是使用 javafx 中的 webview 以获得更好的 css 支持,因为 swing 中的 jtextpane 不支持太多 css。
4 回答
我确实喜欢斯蒂芬卡图尔卡的回答这个想法,如果斯蒂芬的方法适合你,那可能是一个更好的答案。
更新:我刚刚查看了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的示例。
只需从资源中将脚本作为字符串加载,然后调用 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,因为这意味着如果它已经在前一页上加载过,则不必再次加载它。如果你的应用是内网或封闭沙箱,你不必担心这些事情。
JavaFX 确实支持 JQuery,如果您启用了 JavaScript,唯一不起作用的是 JQuery mobile,因为主题滚轮 JRE 出于某种原因无法读取 CSS-UI 控制器。记住 JQuery 仍然是 JavaScript。
我看到你的想法的唯一问题是 JQuery 需要一个 CDN。因此,如果您将 JQuery 包含到 HTML 文档中,请确保包含 JQuery 的 CDN,然后您可以使用带有指向 HTML 文件的链接的加载方法。
我已经尝试过这些解决方案——它们有效,但它们很棘手——而且丑陋。
如果您的环境是从 javafx 程序将页面加载为 html-text 并且您不想访问 Internet,则创建一个包含 jquery.min.js 代码的资源(html 文件)。您只需连接 html 文件。这样,jquery 将按预期运行,在 webview 中加载页面。