I'm using the color picker from http://www.eyecon.ro/colorpicker/ and it works great, but I need multiple color inputs on a page, but initializing each one would be crazy. So I wrapped the initialization code in an each()
accompanied by this
. I'm trying to change the background color and value onchange
. It works fine when I target it using an id or class, but when replaced with this
, lines 12 and 13 of my fiddle don't work. The initial this
works on targeting each input though.
Why is this happening? (or not rather)
jsfiddle: jsfiddle
It's not really clear from the documentation, but the colorPicker stores a reference to the element it's called on in jQuery's data
, and you can access it like this.
$('.color-picker').ColorPicker({
onShow: function (colpkr) {
$(colpkr).fadeIn(500);
return false;
},
onHide: function (colpkr) {
$(colpkr).fadeOut(500);
return false;
},
onChange: function (hsb, hex, rgb) {
var el = $(this).data('colorpicker').el;
$(el).css('backgroundColor', '#' + hex).val('#' + hex);
}
});
Note that you don't need an each loop at all, the plugin is initialized on all elements matching the selector
The reason it doesn't work with this
is because the plugin sets this
to the colorPicker, i.e. the box that pops up, not the input.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다