0

我在页面上同时使用 jQuery 和 JSF 元素。

我的要求是 panelGrid 元素在单击时重定向用户。我通过执行以下操作实现了这一点：

    <h:panelGrid>
    <f:ajax event="click" listener="#{bean.click"/>
    <h:panelGroup>
        <div>
            <h:panelGroup>
                <img src="../resources/img/icon_circle_footer.png" width="20px" height="20px" />
                <div>
                    <div>
                        <div><b>R800,00</b></div>
                        <div>per passenger</div>
                    </div>
                    <div>Company Name</div>
                </div>
                <div>
                    <div>
                        <div>Timespan</div>
                        <div>non-stop</div>
                    </div>
                </div>
                <img src="../resources/img/icon_circle_footer.png" width="20px" height="20px" />
            </h:panelGroup>
        </div>
    </h:panelGroup>
</h:panelGrid>

这工作得很好，但目前没有任何东西可以向用户表明该元素已被单击。

我想在用户单击元素时更改元素的背景，并尝试了以下操作：

<h:panelGrid onmousedown="mousedown(this);" onmouseup="mouseup(this);">
    <f:ajax event="click" listener="#{bean.clickGrid}"
</h:panelGrid>

<script>
    function mousedown(element) {
        element.toggleClass("hilite");
    }

    function mouseup(element) {
        element.toggleClass("hilite");
    }
</script>

单击元素时，JS 会中断并将其记录到控制台：Uncaught TypeError: Object #<HTMLTableElement> as no method 'toggleClass'. 我理解这个问题，但我已经搜索了一种可以应用于表格元素的类似方法，但没有运气。

有人有想法么？

4

1 回答 1

2

是的，DOM 对象没有 toggleClass 方法，它是您尝试调用它们的 jQuery 方法。

如果您包含 jQuery，那么这将是解决方案：

$(element).toggleClass("hilite");

于 2013-09-13T14:45:54.683 回答