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の値を背景色に反映させたいと思っていますがどのように記述すればよろしいでしょうか?

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2011/07/23 10:42:06
  • 終了:2011/07/23 13:21:44

ベストアンサー

id:Lhankor_Mhy No.1

Lhankor_Mhy回答回数775ベストアンサー獲得回数2302011/07/23 10:52:36

ポイント200pt

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

$('.pickfield').each(function(){
  var back_color = $(this).val();
  $(this).css("background", back_color);
}
id:kou32rr

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

ありがとうございます!


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

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);

});

}) ;

2011/07/23 13:24:15

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません