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

Question

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

其实我用：

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

但我的网址后缀为锚符号 ( #)。

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

Answer 1

那是因为它实际上是导航到#. 您需要执行其默认操作，如指定被导航到当前视图，或将URL阻止按钮href或outcome。您可以通过添加return false;到onclick.

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

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

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

该<h:button>作品完全相同的方式，它只是在标准look'n'feel。

另一种方法是使用<p:commandButton type="button">，它生成一个<input type="button">没有任何导航的实数。这样你就不需要从onclick.

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

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