Question

我正在尝试将prettyPhoto jquery plugin与jsf集成，并且不知道如何调用prettyphoto函数。当文档加载时，我想在用户cliks图像时显示照片库。我写了这样的代码：

<script src="/iHome-war/js/jquery.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="/iHome-war/styles/prettyPhoto.css" type="text/css" media="screen" 
charset="utf-8" />
<script src="/iHome-war/js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>
...
<h:form id="soForm">
<div class="articleContent">
<div class="galleryPhoto">
<h:commandLink action="/userimages/22/0.jpg" rel="prettyPhoto">
<h:graphicImage url="/userimages/22/0.jpg" width="120" height="90" alt="photo"/>
</h:commandLink></div></div></h:form> 
...
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("#soForm\\:commandLink[rel^='prettyPhoto']").prettyPhoto();});
</script>

但它不起作用。所以问题是如何调用此函数使其工作？我知道JSF名称由两个元素formid组成：componentid但如何使用该信息？谢谢你的回复。

Answer 1

问题是“commandLink”构造是一个服务器端的东西，它将在Javascript代码在客户端运行时消失。因此，您需要更改选择器：

$("#soForm *[rel^='prettyPhoto']").prettyPhoto();

我不知道“commandLink”在页面上生成了什么，但如果您发现它是<a>标记，则可以将“*”替换为“a”。

Answer 2

jsf有一个forceId属性，你可以使用该属性来强制你想要运行该功能的元素的id，之后你的选择器变成了

jQuery("#THE_ID").prettyPhoto()

如何使用jsf的漂亮照片（jquery gallery插件）？

2 个答案: