jquery-ui - phonegap 中颜色选择器的示例代码

Question

我无法修复 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>';

Answer 1

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

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

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

在您的脚本文件中

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

希望对你有帮助

Answer 2

有一个付费颜色选择器 JQuery Mobile Color Picker，只有在没有找到解决方案的情况下才使用它！

Answer 3

使用 Angular-JS 指令ngjs-color-picker解决

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