phonegap中的colorpicker的示例代码 [英] example code for colorpicker in phonegap

问题描述

我无法修复colorpicker.js在phonegap，它不工作！

  $（'＃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 =newtexttype =textvalue =Hello！>'; 
 
 // html + ='< input id =changetype =colorvalue =＃ff0667data-text =hiddenstyle =height：20px; width：20px ; />'; 
 
 html + ='< input type =textid =hex_color>'; 
 html + ='< div id =colorSelector>< div style =background-color：＃0000ff>< / div>< / div>'; 
 
 html + ='< button id =addbutton>添加此文本< / button>'; 
 html + ='< / div>'; 
  

解决方案

尝试 Spectrum Colorpicker 。这是非常漂亮的颜色选择器插件。

下载zip文件并包括 spectrum.js 文件和< c $ c> spectrum.css 文件到您的页面。然后您必须创建如下的文本框：

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

您的脚本文件内

  $（＃custom）。spectrum（{
 color：＃f00
}）; 
  

希望它帮助了你

I cant fix colorpicker.js in phonegap, it is not working! Some help, please?

thanks

$('#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>';

解决方案

Try Spectrum Colorpicker. This is very nice color picker plugin.

Download the zip file and include the spectrum.js file and spectrum.css file to your page. Then you have to create a text box as follows

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

Inside your script file

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

Hope it helped you

这篇关于phonegap中的colorpicker的示例代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！