獲取實例調用方法？

Question

我目前正在嘗試設置顏色選擇器的值。 我正在使用這個顏色選擇器： http : //mjolnic.github.io/bootstrap-colorpicker/

使用jquery將colorpicker綁定到html元素：

$('.sample-selector').colorpicker({ /*options...*/ });

它還有一些方法，例如：

.setColor(value)

如何獲取colorpicker實例，以便可以調用方法？

我嘗試了很多事情。 首先我初始化colorpicker：

$('#thecolor').colorpicker();

這可行。 但是我似乎找不到找到方法的方法：

$('#thecolor').colorpicker.toRGB()
$('#thecolor').toRGB()
$('#thecolor').colorpicker().toRGB()

等等。 它必須但確實很小：)

Answer 1

要從DOM獲取colorpicker實例：

var cp = $('#thecolor').data().colorpicker;

顏色對象是一個屬性：

cp.color.toRGB();

Answer 2

從bootstrap-colorpicker文檔中，您可以像這樣調用toRGB ：

$('#thecolor').colorpicker().on('changeColor', function(ev){
    console.log(ev.color.toRGB());
});

Answer 3

我認為您錯過了這一行：

顏色對象方法

每個觸發的事件都有一個顏色對象，供選擇器內部使用。 該對象有幾種有用的方法。

看下面的例子：

$('.my-colorpicker-control').colorpicker().on('changeColor', function(ev){
    bodyStyle.backgroundColor = ev.color.toHex();
});

因此無法從外部使用。 您可以嘗試破解（未經測試）

$('.my-colorpicker-control').colorpicker().on('create', function(ev) {
    window.mycolorpicker = ev.color;
});

if (window.mycolorpicker) {
    window.mycolorpicker.setColor('...');
}

祝好運！

Answer 4

嘗試這個：

var colorPicker = $("#thecolor").colorpicker();
$(colorPicker).toRGB(); // object method