我正在使用jQuery微调器将+/-值添加到我在mysql数据库传播的表中的输入字段中。
我想将列顶部的+/-集成到该列中每个输入的+/- 1,以及每个输入都有自己的按钮。
我为jQuery尝试了以下内容:
<script type="text/javascript" src="js/ui.spinner.js"></script>
<script type="text/javascript">
jQuery().ready(function($) {
$('.spinner').spinner({ min: 0, max: 100 });
$('#spinnerall').spinner().change(function() {$('.spinner').spinner('option', 'max', parseInt($(this).val()));});
$('#spinnerall').spinner().change(function() {$('.spinner').spinner('option', 'min', parseInt($(this).val()));});
});
</script>
然后这是表格代码:
<td><input type='text' class='spinner' value='$max' /></td>
<input type='text' id='spinnerall' />
“spinnerall”实际上并不需要作为输入,但我无论如何都无法弄清楚。否则就称之为。
使用上面使用的代码的spinnerall输入,将所有输入重置为与当前相同的值相同,而不是仅添加或减去1。
答案 0 :(得分:2)
如果我能理解这个问题,答案应该是这样的:
<script type="text/javascript" src="js/ui.spinner.js"></script>
<script type="text/javascript">
$(function(){
var $sa = $('#spinnerall').spinner().change(function() {
var $me = $(this);
// we need the offset between the start and current position
var offset = parseInt($me.attr('data-init')) - parseInt($me.val());
$ss.each(function(){
// applying the offset to all spinners
this.value = parseInt($(this).attr('data-init')) - offset;
// allow only positive or zero
this.value *= (this.value > 0);
})
});
$sa.attr('data-init',$sa.val());
var $ss = $('.spinner').spinner({ min: 0, max: 100 }).change(function(){
var $me = $(this);
// replacing the initial value with the current (without the offset)
$me.attr('data-init',parseInt($me.val()) - parseInt($sa.attr('data-init')) - parseInt($sa.val()));
}).change();
});
</script>
我用这个标记测试了它:
<input type="text" class="spinner" value="1" /><br/>
<input type="text" class="spinner" value="-5" /><br/>
<input type="text" class="spinner" value="7" /><br/><br/>
<input type='text' id='spinnerall' value="0" />
以下是jsfiddle.net
中的示例