Есть 10 input'ов:
<form action="method_post.php" method="post" style="width: 500px;">
<div id="picker" style="float: right;"></div>
<div class="form-item">
<label for="color1">Цвет 1:</label>
<input type="text" id="color1" name="color1" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color2">Цвет 2:</label>
<input type="text" id="color2" name="color2" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 3:</label>
<input type="text" id="color3" name="color3" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 4:</label>
<input type="text" id="color4" name="color4" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 5:</label>
<input type="text" id="color5" name="color5" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 6:</label>
<input type="text" id="color6" name="color6" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 7:</label>
<input type="text" id="color7" name="color7" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 8:</label>
<input type="text" id="color8" name="color8" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 9:</label>
<input type="text" id="color9" name="color9" class="colorwell" value="#eadc9a" />
</div>
<div class="form-item">
<label for="color3">Цвет 10:</label>
<input type="text" id="color10" name="color10" class="colorwell" value="#eadc9a" />
</div>
<input type="submit" value="Отправить">
</form>
И есть скрипт:
$(document).ready(function() {
var f = $.farbtastic('#picker');
var p = $('#picker').css('opacity', 0.25);
var selected;
$('.colorwell')
.each(function () { f.linkTo(this); })
.focus(function() {
if (selected) {
$(selected).removeClass('colorwell-selected');
}
f.linkTo(this);
p.css('opacity', 1);
$(selected = this).addClass('colorwell-selected');
});
$('.colorwell').on('input', function () {
console.log($(this).val());
});
});
Мне нужно получить значение input'a, а потом с помощью .css применить этот цвет для ссылок или фонов определенных div.
Проблема в том, что мой способ:
$('#color1').on('input', function () {
console.log($(this).val());
});
Работает только когда добавляешь/удаляешь что либо в input (то есть по клику). А у меня цвет добавляется с помощью скрипта (color picker). http://ssmaker.ru/1d2e1691.jpg