phonegap中colorpicker的示例代码

时间:2013-09-10 10:46:52

标签: jquery-ui jquery-mobile cordova

我无法修复phonegap中的colorpicker.js,它无法正常工作!请帮忙吗?

感谢

$('#colorSelector').ColorPicker({
                    color: '#0000ff',
                    onShow: function (colpkr) {
                        $(colpkr).fadeIn(500);
                        return false;
                    },
                    onHide: function (colpkr) {
                        $(colpkr).fadeOut(500);
                        return false;
                    },
                    onChange: function (hsb, hex, rgb) {

                        //$('body').css('background', '#' + hex);
                        $("#hex_color").val('#'+hex);

                    }
                });
    var html ='<div id="texto">';
                        html +='<input id="newtext" type="text" value="Hello!">';

                        //html +='<input id="change" type="color" value="#ff0667" data-text="hidden" style="height:20px;width:20px;" />';

                        html += '<input type="text" id="hex_color">';
                        html += '<div id="colorSelector"><div style="background-color: #0000ff"></div></div>';

                        html +='<button id="addbutton">Add this text</button>';
                        html +='</div>';

3 个答案:

答案 0 :(得分:1)

试试Spectrum Colorpicker。这是一个非常好的颜色选择器插件。

下载zip文件并将spectrum.js文件和spectrum.css文件包含在您的信息页中。然后你必须创建一个文本框如下

<input type='color' id='custom' />

在脚本文件中

 $("#custom").spectrum({
    color: "#f00"
 });

希望它能帮到你

答案 1 :(得分:0)

有一个付费颜色选择器JQuery Mobile Color Picker,只有在您找不到解决方案时才使用它!

答案 2 :(得分:0)

解决了 Angular-JS指令 ngjs-color-picker

一个小指令,基本上是一个颜色选择器,但有一些额外的功能 - 用于 Angular-JS 。适用于在phonegap / Cordova应用程序中开发自定义颜色托盘。