如何在点击JSF按钮和阻止页面重新加载/导航时调用JS函数？

Question

使用JSF创建一个调用JS函数的按钮的首选方法是什么？

其实我用的是：

<p:button onclick="myJSFunction();" href="#"/>

但我的网址后缀为锚符号（#）。

是否有另一种推荐方法来创建按钮，它不会重新加载/导航到URL但是请调用JS函数？

Answer 1

那是因为它实际导航到#。您需要阻止该按钮执行其默认操作，即导航到当前视图或href或outcome中指定的URL。您可以通过将return false;添加到onclick的末尾来实现此目的。

<p:button onclick="myJSFunction(); return false;" />

或者，如果myJSFunction()实际返回一个boolean，它应确定该按钮是否应继续其默认操作，然后委托给它：

<p:button onclick="return myJSFunction();" />

<h:button>的工作原理完全相同，只是标准的'look'n'feel。

另一种方法是使用<p:commandButton type="button">生成真实<input type="button">而无需任何导航。这样您就不需要从onclick返回false。

<p:commandButton type="button" onclick="myJSFunction()" />

然而，这需要<h:form>（尽管将其置于任何形式之外不会破坏任何功能）。这同样适用于<h:commandButton>。