color picker

本文介绍了如何在JSF项目中使用JSColor库来替代富面富组件库RichFaces中的colorPicker组件,解决了版本不兼容导致的选择颜色功能失效问题。文章详细展示了相关代码实现和配置步骤,包括引入JSColor JS文件、定义样式类以及使用input元素进行颜色选择,并提供了实际应用示例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

color picker

 

最近项目要用到一个color picker, 前台是用JSF开发的,我首先想到 richfaces rich:colorPicker,但是发现rich:colorPicker is only available since 3.3.1.,我现在用的version 是3.3.0,于upgrade it to 3.3.2. , the latest version is 3.3.3

rich:colorPicker可以显示,但不能选择color,出现JS error:jQuery(".rich-color-picker-color").pngFix is not a function, google一下,其官方文档说在version is 3.3.3中,rich:colorPicker的CSS存在bug,于是放弃了。

 

又从网上找了一个color piker,效果不错,而且相当easy.

JSF code:

 

<script type="text/javascript" charset="utf-8"
            src="<%=response.encodeURL(request.getContextPath() + "/js/jscolor/jscolor.js")%>"></script>

 

              <td>
                 <h:outputLabel value="Banner Background Colour"/>
             </td>
             <td colspan="2">
                <h:outputText value="<input class='color' value='#{agencyWebsiteUserEditBean.awsBannerBGColour[0]}'>" escape="false"/>
             </td>

 

关銉是class='color',同时可以加入其它option

 

<input class="color {required:false}">
<input class="color {adjust:false}">
<input class="color {hash:true}">
<input class="color {hash:true,caps:false}">

 

Demo: http://jscolor.com/try.php

Download:http://jscolor.com/download.php

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值