javascript 无法在 内隐藏按钮

Question

我想在提交对话框时隐藏我的图标/按钮...当我将我的图标/按钮放在 <h:form> 中时，我的代码停止工作

这是我的图标的代码

<h:outputLink id="loginLink" value="javascript:void(0)"
                onclick="dlg.show()">
            <p:graphicImage value="/images/logo.png" />
</h:outputLink>

这是对话框的代码

<p:dialog id="dialog" header="Login" widgetVar="dlg">
    <h:form>
        <p:commandButton value="Login"
                oncomplete="handleLoginRequest(xhr, status, args)" />
    </h:form>
</p:dialog>

现在这是我的脚本

<script type="text/javascript">
function handleLoginRequest(xhr, status, args) {
        dlg.hide();
    jQuery('#loginLink').fadeOut();
    alert("This is working fine");
}
</script>

这样一切都很好.. alert("This is working fine");工作正常，我的图标也淡出....

但是当我将图标放在 <h:form></h:form> 中时图标不会淡出(脚本工作正常但无法到达我在里面的图标 <h:form>

例如:

<h:form>
    <h:outputLink id="loginLink" value="javascript:void(0)"
            onclick="dlg.show()">
        <p:graphicImage value="/images/logo.png" />
    </h:outputLink>
</h:form>

这样我就面临问题:(

附言:使用 <h:form>对我来说是必须的，因为我要把我的代码放在 <p:menuitem> 中需要放在里面 <h:form>

Answer 1

感谢回复:)下面的代码对我来说很好用

<h:form id="loginForm">

在 javaScript 中

jQuery('#loginForm').fadeOut();

(#id of form 代替 #id of button/link )

这样我就可以隐藏带有图标/按钮的完整表单...

实际上，当我将我的按钮/链接、图标放在<h:form> 内时按钮的 id 对 javaScript 不可见

当我将 id 赋予 <h:form> 时并隐藏整个表单而不是单个组件(按钮)它对我来说很好:)

我会在 <p:menutem/> 中尝试这个希望这在那里工作得很好......