带有<p：panelgrid>的ZClip不起作用</p：panelgrid>
在我的JSF-Primefaces网络应用程序中复制到剪贴板我正在使用zClip。一切都适用于下面由RongNK给出的小代码snipet，但不适用于我的实际代码请在下面找到：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<f:view id="offer_details" encoding="UTF-8" contentType="text/html">
<h:head>
</h:head>
<h:body>
<h:outputStylesheet library="default" name="css/discount_box.css" />
<h:outputStylesheet library="default" name="css/discountbox_primefaces.css" />
<h:outputScript library="default" name="js/discount_box.js" />
<h:outputScript library="default" name="js/jquery-1.9.1.min.js"/>
<h:outputScript library="default" name="js/jquery.zclip.js"/>
<script type="text/javascript">
$(document).ready(function(){
$('#copylink').zclip({
path:"#{resource['default:js/ZeroClipboard.swf']}",
copy:$('#offer_details_form\\:txt1').text()
});
});
</script>
<table align="center" width="100%">
<tr>
<td><!-- left panel --></td>
<td align="center" width="1000px"><!-- center panel -->
<ui:include src="header.xhtml" /><!-- header panel -->
<table align="center" width="100%"><!-- content panel -->
<tr>
<td>
<table align="center" width="100%">
<tr>
<td align="left" width="75%" valign="top">
<p:panel id="offer_details_panel" header="#{OfrDetBen.offer.where}" styleClass="panel-grid tr panel-grid td">
<p:panelGrid columns="2" styleClass="panel-grid">
<p:panelGrid columns="1" styleClass="panel-grid">
<h:graphicImage alt="#{OfrDetBen.offer.where}" value="#{OfrDetBen.offer.imgFullPath}" class="medium-panel-image" />
<h:form id="offer_rating_form">
<p:rating value="#{OfrDetBen.offer.rating}" />
</h:form>
</p:panelGrid>
<h:form id="offer_details_form">
<p:panelGrid columns="2" styleClass="panel-grid">
<h:outputText value="#{msg._offer}#{msg._colon} " rendered="#{OfrDetBen.offer.isOfferByTitle}" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.what}" rendered="#{OfrDetBen.offer.isOfferByTitle}" styleClass="font-size-1em font-weight-bold default-font-color" />
<h:outputText value="#{msg._original_price}#{msg._colon} " rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.originalPrice}" style="text-decoration: line-through" rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold default-font-color" />
<h:outputText value="#{msg._discount_offer}#{msg._colon} " rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.discount}" rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold default-font-color" />
<h:outputText value="#{msg._offer_price}#{msg._colon} " rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.offerPrice}" rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold default-font-color" />
<h:outputText value="#{msg._savings}#{msg._colon} " rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.savings}" rendered="#{OfrDetBen.offer.isOfferByDetails}" styleClass="font-size-1em font-weight-bold default-font-color" />
<h:outputText value="#{msg._offer_on}#{msg._colon} " styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.tag}" styleClass="font-size-1em" />
<h:outputText value="#{msg._validity}#{msg._colon} " styleClass="font-size-1em font-weight-bold"/>
<p:panelGrid columns="2" styleClass="panel-grid">
<h:outputText value="#{msg._valid_from}#{msg._colon} " styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.beginsAsString}" styleClass="font-size-1em" />
<h:outputText value="#{msg._valid_till}#{msg._colon} " styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.endsAsString}" styleClass="font-size-1em" />
</p:panelGrid>
<h:outputText value="#{msg._details}#{msg._colon} " rendered="#{!empty OfrDetBen.offer.description}" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="#{OfrDetBen.offer.description}" rendered="#{!empty OfrDetBen.offer.description}" styleClass="font-size-1em" />
<h:outputText value="#{msg._share}#{msg._colon} " styleClass="font-size-1em font-weight-bold"/>
<!-- Facebook button -->
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1;appId=205623646117694";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!-- Google +1 button -->
<div class="g-plusone" data-size="medium" style="padding-right: 200px !"></div>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
<!-- Twittter button -->
<a href="https://twitter.com/share" class="twitter-share-button" data-via="discountboxin" data-related="discountboxin" data-dnt="true">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<!-- Facebook button -->
<div class="fb-like" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true" data-font="trebuchet ms"></div>
<h:outputText id="txt1" value="Stackoverflow"/>
<a id="copylink" href="#">Copy Description</a>
<h:outputText value="hidden" styleClass="hidden-text" rendered="#{OfrDetBen.offer.isExclusiveOffer and empty OfrDetBen.offer.couponCode}" />
<p:panelGrid columns="4" styleClass="panel-grid" rendered="#{OfrDetBen.offer.isExclusiveOffer and empty OfrDetBen.offer.couponCode}">
<h:outputText value="hidden" styleClass="hidden-text" />
<h:outputText value="hidden" styleClass="hidden-text" />
<h:outputText value="hidden" styleClass="hidden-text" />
<p:commandButton value="Get coupon" update="@form" action="#{OfrDetBen.getCouponCode}" />
</p:panelGrid>
<h:outputText value="hidden" styleClass="hidden-text" rendered="#{OfrDetBen.offer.isExclusiveOffer and !empty OfrDetBen.offer.couponCode}" />
<p:panel id="coupon_details" header="Coupon code and instructions" rendered="#{OfrDetBen.offer.isExclusiveOffer and !empty OfrDetBen.offer.couponCode}" styleClass="panel-grid tr panel-grid td panel-header-title-small">
<p:panelGrid columns="1">
<h:outputText value="COPY this coupon code: #{OfrDetBen.offer.couponCode}" styleClass="font-size-1.5em font-weight-bold default-font-color" />
<ui:repeat var="venue" value="#{OfrDetBen.offer.venues}" varStatus="status">
<div>
<h:outputText value="CLICK here: " styleClass="font-size-1em font-weight-bold" />
<h:outputLink value="#{venue.onlineVenueAsURL}" target="new" rendered="#{!empty venue.city and venue.city == 'Online'}">#{venue.venueAsDisplayString}</h:outputLink>
</div>
</ui:repeat>
<div class="component-spacing-top"/>
<h:outputText value="How to use coupon?" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="For online offers:" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="1. Copy the coupon code and click in the URL" styleClass="font-size-1em text-left-padding" />
<h:outputText value="2. Use the coupon code while making payment" styleClass="font-size-1em text-left-padding" />
<h:outputText value="For in-store offers:" styleClass="font-size-1em font-weight-bold"/>
<h:outputText value="1. Make a note of the coupon code" styleClass="font-size-1em text-left-padding" />
<h:outputText value="2. Use ot while making payment" styleClass="font-size-1em text-left-padding" />
</p:panelGrid>
</p:panel>
</p:panelGrid>
</h:form>
</p:panelGrid>
<div class="component-spacing-top"/>
<div align="center"><h:graphicImage alt="#{OfrDetBen.offer.where}" value="#{OfrDetBen.offer.bnrFullPath}" rendered="#{!empty OfrDetBen.offer.bnrFullPath}" class="banner-image" /></div>
<div class="component-spacing-top"/>
</p:panel>
<div class="component-spacing-top"/>
<p:tabView id="tabView">
<p:tab id="tab_venues" title="#{msg._venues}">
<ui:repeat value="#{OfrDetBen.offer.venues}" var="venue" varStatus="status">
<div>
<h:graphicImage alt="Online store" name="img/online_store.jpg" rendered="#{!empty venue.city and venue.city == 'Online'}" style="padding-right: 5px" library="default"/>
<h:graphicImage alt="In-store" name="img/physical_store.jpg" rendered="#{!empty venue.city and venue.city != 'Online'}" style="padding-right: 5px" library="default"/>
<h:outputText value="#{venue.venueAsDisplayString}" rendered="#{!empty venue.city and venue.city != 'Online'}" styleClass="font-size-1em" />
<h:outputLink value="#{venue.onlineVenueAsURL}" target="new" rendered="#{!empty venue.city and venue.city == 'Online'}" >#{venue.venueAsDisplayString}</h:outputLink>
<h:outputText value=", #{venue.contactDetails}" rendered="#{!empty venue.contactDetails}" styleClass="font-size-1em" />
</div>
</ui:repeat>
</p:tab>
<p:tab id="tab_terms" title="#{msg._terms_and_conditions}" rendered="#{!empty OfrDetBen.offer.termsConditions}">
<h:outputText value="#{OfrDetBen.offer.termsConditions}" styleClass="font-size-1em" />
</p:tab>
<p:tab id="tab_reviews" title="#{msg._reviews_comments}">
<div align="center">
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1;appId=101408836627673";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments" data-href="http://www.discountbox.in/offer_details.xhtml?offer=#{OfrDetBen.choosenOfferSeoURL}" data-num-posts="5" data-width="685"></div>
</div>
</p:tab>
</p:tabView>
</td>
</tr>
</table>
</td>
</tr>
</table>
<ui:include src="footer.xhtml" /><!-- footer panel -->
</td>
<td><!-- right panel --></td>
</tr>
</table>
</h:body>
</f:view>
</html>
1 个答案:
答案 0 :(得分：1)
我刚刚测试过，它工作正常（从here下载zClip）：
在copy参数中，您可以使用某个选择器（例如：$('#myform\\:txt1')的替代方式是使用styleClass $('.zzzxxx')选择
<h:head>
</h:head>
<h:body>
<h:outputScript library="js" name="jquery-1.9.1.min.js"/>
<h:outputScript library="js" name="jquery.zclip.min.js"/>
<script type="text/javascript">
$(document).ready(function(){
$('#copylink').zclip({
path:"#{resource['js:ZeroClipboard.swf']}",
copy:$('#myform\\:txt1').text()
});
});
</script>
<h:form id="myform">
<p:panel>
<h:outputText styleClass="zzzxxx" id="txt1" value="Stackoverflow"/>
<a id="copylink" href="#">Copy Description</a>
</p:panel>
</h:form>
</h:body>
<强>结果：
相关问题
- 在<p：panelgrid>中<h：outputtext>不起作用？</p：panelgrid> </h：outputtext>
- 为什么p：panelGrid不能用于ui：repeat？
- jQuery zClip没有使用我附加的表。这可能是版本冲突吗？
- 带有<p：panelgrid>的ZClip不起作用</p：panelgrid>
- Jquery活不使用zclip？
- Zclip并没有在JsFiddle上工作
- p：panelGrid里面的p：panelGrid，如何删除外部p：panelGrid中的边框？
- p：panelGrid多列不起作用
- p：panelGrid究竟是如何扩展h：panelGrid的
- Primefaces响应<p：panelgrid>不使用5列
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？