Question

我有一个jsf页面，即使面板内有链接，整个面板也可以点击。这是通过将以下js函数应用于jsf页面来完成的。（请注意页面结构）

<h:panelGroup layout="block" styleClass="col-md-3">
    <h:form>
        <ui:repeat> 
            //lots of panels and panel groups   
        </ui:repeat> 

        **<h:outputScript>
            $(function() {
                setupPanelLinks();
            });
        </h:outputScript>**    

    </h:form>    
</h:panelGroup>
<h:panelGroup id =**"SeceondPanelGroup"** layout="block" styleClass="col-md-6 col-md-offset-1">
</h:panelGroup>

其中js函数位于另一个单独的.js页面

function setupPanelLinks() {
    $(".panel").click(function() {
        window.location.href = $(this).find("a.myLink").attr('href');
    });

    $(".panel a").click(function(e) {
        e.stopPropagation();
    });
}

其中myLink是一个styleClass，应用于ui中的h：link：重复第一个。

现在一切正常。问题是javascript函数应用于jsf页面中的所有面板，因为我想将它仅应用于上面板组而不是“SecondPanelGroup”。我的JS知识是有限的，但我猜我们需要一个js函数的目标来缩小其范围。有什么建议可以实现吗？

javascript函数可以应用于页面的某个部分，例如div而不是整个页面吗？

Answer 1

javascript函数可以应用于页面的某个部分，例如div而不是整个页面吗？

是的，javascript函数可以做到这一点。在您的情况下，该函数应用于整个页面或者让所有panelGroups说，因为在您的函数127.0.0.1中，您使用setupPanelLinks()这就是在html中呈现panelGroups的方式。

在你要应用它的panelGroups上，给它们一个id（如果它们不止一个，给它们一个styleClass作为id，不能在同一个jsf页面中重复）并在你的id / styleClass中使用函数而不是(".panel") .eg

(".panel")

将h：outputScript应用于h：panelGroup而不是整个jsf页面

1 个答案: