Question

我正在使用 liferay-ui：标签，每当我点击任一标签页时，整个页面都会刷新。我不希望页面得到刷新。所以，我试过这个 liferay-ui：section 标记并将 liferay-ui：tabs 的“refresh”属性设置为false。但是这样做，我发现当第一次加载portlet时，所有选项卡的内容也会同时加载，这会降低性能因素。这是我的代码：

 <liferay-ui:tabs names="<%= tabs %>" refresh="false" param="selectedTab">
    <liferay-ui:section >
        <liferay-util:include page="/html/resourceurlajax/sample_tab_1.jsp" servletContext="<%=this.getServletContext() %>" />
    </liferay-ui:section>

    <liferay-ui:section>
        <liferay-util:include page="/html/resourceurlajax/sample_tab_2.jsp" servletContext="<%=this.getServletContext() %>" />
    </liferay-ui:section>

    <liferay-ui:section>
        <liferay-util:include page="/html/resourceurlajax/sample_tab_3.jsp" servletContext="<%=this.getServletContext() %>" />
    </liferay-ui:section>
</liferay-ui:tabs>

我尝试使用jQuery实现这一点，方法是在 div 元素中保留 liferay-ui：tabs ，然后点击 div＃id 元素，我试图获得点击标签的名称。但是这显示了“jQuery not defined ”类型的错误，而jQuery正在使用toggle（）函数。我发现在fireBug控制台中运行jQuery代码时，我得到了带有相应选项卡名称的警告onClick of tab，但是否则显示错误。

以下是使用jQuery的代码。

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
 <script type="text/javascript">
 $(document).ready(function(){  
      $("#<portlet:namespace/>ajax-tabs-demo.aui-tab").click(function(){
        alert($('a',this).html());
    }); 

});
 /script>

<div id="<portlet:namespace/>ajax-tabs-demo">
<liferay-ui:tabs names="<%= tabs %>" refresh="false" param="selectedTab">

</liferay-ui:tabs>

有没有办法使用ajax实现这个（如果我点击选项卡名称或tab-id），那么当我点击选项卡时，只有该选项卡的内容会被加载出来刷新。请给我一些如何做的建议。请帮帮我。谢谢。

Answer 1

我是liferay的新手，但最近我使用Liferay.fire和Liferay.on（客户端IPC）在IPC中实现了AJAX。我成功实现了AJAX的功能。这里有一些链接。可能对你有帮助......

http://www.liferay.com/community/wiki/-/wiki/Main/portlet+to+portlet+communication

http://www.liferay.com/community/wiki/-/wiki/Main/Inter-portlet+communication

因此，您可以尝试在单击选项卡上实现此功能，因为您有选项卡（在我的情况下，我有按钮）。希望这可以帮助您解决问题。

如何使用Ajax实现liferay-ui：tabs？

1 个答案: