Я пытался решить эту проблему в течение нескольких часов сегодня.Я достиг (каким-то образом) решения, но не работает должным образом.
Я новичок в мире jQuery, поэтому постараюсь быть ясным.В моем примере у меня есть страница xhtml, которая включает в себя еще одну страницу xhtml с тегом <ui:include>
.Страница, которая включена, я не отрендерена (из-за всех изображений).Когда она отображается через <p:commandLink>
, страница отображается со всеми изображениями правильно.* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *} * * * * *} Когда картинка окончательно отображается и я впервые нажимаю <h:ouputLink>
, fancyBox не показывает fancyBox., но последующие клики открывают fancyBox, и он работает правильно.Я не могу понять, почему.Я использую jsf2, PrimeFaces 3.02, FancyBox 1.7.Мой код:
main.xhtml
<--Main xhtml-->
<h:form id="myForm">
<h:panelGrid id="panelGridMain"
rendered="#{myBean.actualPage eq 'main'}">
<p:commandLink
id="showIncludedPage"
actionListener="#{myBean.setPage('test')}"
update="@form">
<h:graphicImage value="/Image/TbnPic1.jpg"/>
</p:commandLink>
</h:panelGrid>
<h:panelGroup id="myTestPanel" rendered="#{myBean.actualPage eq 'test'}">
<ui:include src="test.xhtml" />
</h:panelGroup>
</h:form>
Test.xhtml
<ui:component xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:outputLink value="/Images/Pic1.jpg" id="example1" title="" >
<h:graphicImage alt="example1" value="/Images/TbnPic1.jpg" />
</h:outputLink>
</ui:component>
Наконец-то мой код jQuery
$(document).ready(
function() {
$("#myForm\\:example1").live("click",function(e) {
alert(e.isDefaultPrevented());
if (! e.isDefaultPrevented()){
e.preventDefault();
}
$(this).fancybox();
});
});
Некоторые восклицания:
* Я отмечаю, что .on()
рекомендуется, но у меня это не сработало, мне нужно сделать больше тестов.
* Мне пришлось добавить e.preventDefault () к моему.js, потому что когда я нажимал на ссылку, чтобы открыть всплывающее окно fancyBox, ссылка перенаправляла на URL, содержащий фотографию (например: localhost: 8080 /../ Images / Pic1.jpg)
*, еслиПервоначально страница была обработана, fancyBox работал правильно.
Спасибо за любую помощь, надеюсь, вы можете понять проблему =)