人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jqueryについて質問です。

$(function(){
var back_color = $('.pickfield').val();
$('.pickfield').css("background", back_color);
});

<input type="text" name="name1" value="name1の値" class="pickfield" />
<input type="text" name="name2" value="name2の値" class="pickfield" />

カラーピッカーを実現したく上記のようなコードを書いており、
当然ではありますが上記のコードのままだと、
両方のinputの背景色が「value="name1の値"」の値になってしまいます。

本当はthisを使ってそれぞれのvalueの値を背景色に反映させたいと思っていますがどのように記述すればよろしいでしょうか?

●質問者: kou32rr
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:background CSS jQuery カラー コード
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● Lhankor_Mhy
●200ポイント ベストアンサー

動作確認してないです、バグったらすみません。

$('.pickfield').each(function(){
 var back_color = $(this).val();
 $(this).css("background", back_color);
}
◎質問者からの返答

期待どおりの動作になりました。

ありがとうございます!


メモ書きとして今回実現できたコード入れておきます。

http://www.eyecon.ro/colorpicker/

こちらのプラグインを利用しました。

$(function(){

$('.pickfield').each(function(){

var back_color = $(this).val();

$(this).css("background", back_color);

});

$('.pickfield').ColorPicker({

onSubmit: function(hsb, hex, rgb, el) {

$(el).css("background", "#"+ hex);

$(el).val('#'+hex);

$(el).next().val('#'+hex);

$(el).ColorPickerHide();

},

onBeforeShow: function () {

$(this).ColorPickerSetColor(this.value);

}

})

.bind('keyup', function(){

$(this).ColorPickerSetColor(this.value);

});

}) ;

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ