从JavaFX代码中调用JavaScript命令
扩展WebViewSample应用程序，引入一个帮助文件，并执行一个JavaScript命令，用于切换帮助文件中的主题列表。创建一个帮助工具栏项，该项导向help.html文件，在该文件中用户可以预览有关Oracle网站的参考资料。
将help.html文件添加到WebViewSample应用程序中。
示例5-1 help.html文件
<html lang="en">
<head>
<!-- 可见性切换脚本 -->
<script type="text/javascript">
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if (e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
//-->
</script>
</head>
<body>
<h1>在线帮助</h1>
<p class="boxtitle"><a href="#" onclick="toggle_visibility('help_topics');"
class="boxtitle">[+] 显示/隐藏帮助主题</a></p>
<ul id="help_topics" style='display:none;'>
<li>产品 - Oracle硬件和软件产品的详细概述，以及Oracle咨询、支持和教育服务的摘要。</li>
<li>博客 - Oracle博客社区（使用“隐藏全部”和“显示全部”按钮折叠和展开主题列表）。</li>
<li>文档 - 开始学习Java的入口页面。该页面包含Java教程、开发人员指南和API文档的链接。</li>
<li>合作伙伴 - Oracle合作伙伴解决方案和计划。热门资源和会员机会。</li>
</ul>
</body>
</html>
修改后的应用程序代码如示例5-2所示，创建了帮助工具栏项和一个额外的按钮，用于隐藏和显示帮助主题。该按钮仅在选择帮助页面时添加到工具栏中。
示例5-2 添加切换帮助主题按钮
"help.png" "帮助" WebViewSample.class.getResource("help.html").toExternalForm() final Button toggleHelpTopics = new Button("切换帮助主题"); private boolean needDocumentationButton = false; final boolean addButton = (hpl.getText().equals("帮助")); toggleHelpTopics.setOnAction((ActionEvent t) -> { webEngine.executeScript("toggle_visibility('help_topics')"); }); webEngine.getLoadWorker().stateProperty().addListener( (ObservableValue<? extends State> ov, State oldState, State newState) -> { toolBar.getChildren().remove(toggleHelpTopics); if (newState == State.SUCCEEDED) { if (needDocumentationButton) { toolBar.getChildren().add(toggleHelpTopics); } } });
加载始终在后台线程上进行。启动加载的方法在调度后立即返回。 getLoadWorker() 方法提供了一个 Worker 接口的实例来跟踪加载进度。如果帮助页面的进度状态为 SUCCEEDED，则会将“切换帮助主题”按钮添加到工具栏中，如图5-1所示。
setOnAction 方法在示例5-3中定义了切换帮助主题按钮的行为。
示例5-3 执行JavaScript命令
//为按钮设置动作
toggleHelpTopics.setOnAction((ActionEvent t) -> {
webEngine.executeScript("toggle_visibility('help_topics')");
});
当用户点击切换帮助主题按钮时，executeScript 方法会在 help.html 页面上运行 toggle_visibility JavaScript 函数，帮助主题会显示出来，如图5-2所示。当用户再次点击时，toggle_visibility 函数会隐藏主题列表。
