我有两个号码选择器,其中一个在另一个号码下,但我需要将它们并排,但我不能成功。数字选择器也以某种方式连接起来。当我按下他们两个向上移动。它可能是因为在click函数上调用类微调器,但我不知道如何在不为每个函数编写函数的情况下将它们分开。
$('<br/>').appendTo(tabPage);
$('<br/>').appendTo(tabPage);
var tableSpinnerRow = $('<div class="row"/>').appendTo(tabPage);
var spinnerContainer = $('<div class=" container col-xs-12 "/>').appendTo(tableSpinnerRow);
var spinner1 = $('<div class=" input-group spinner col-xs-2"/>').appendTo(spinnerContainer);
var input1 = $('<input type="text" class="form-control " value="1"/>').appendTo(spinner1);
var input_Group1 = $('<div class="input-group-btn-vertical"/>').appendTo(spinner1);
var buttonPlus1 = $('<button class="btn btn-default"><i class="fa fa-caret-up"></i></button>').appendTo(input_Group1);
var buttonMinus1 = $('<button class="btn btn-default"><i class="fa fa-caret-down"></i></button>').appendTo(input_Group1);
$('<br/>').appendTo(tabPage);
var spinnerContainer2 = $('<div class=" container col-xs-12"/>').appendTo(tableSpinnerRow);
var spinner2 = $('<div class=" input-group spinner col-xs-2"/>').appendTo(spinnerContainer2);
var input2 = $('<input type="text" class="form-control" value="1"/>').appendTo(spinner2);
var input_Group2 = $('<div class="input-group-btn-vertical"/>').appendTo(spinner2);
var buttonPlus2 = $('<button class="btn btn-default"><i class="fa fa-caret-up"></i></button>').appendTo(input_Group2);
var buttonMinus2 = $('<button class="btn btn-default"><i class="fa fa-caret-down"></i></button>').appendTo(input_Group2);
(function ($) {
$('.spinner .btn:first-of-type').on('click', function() {
$('.spinner input').val( parseInt($('.spinner input').val(), 10) + 1);
});
$('.spinner .btn:last-of-type').on('click', function() {
$('.spinner input').val( parseInt($('.spinner input').val(), 10) - 1);
});
})(jQuery);
答案 0 :(得分:2)
很难在没有小提琴,链接到您的页面或css的情况下提供有关对齐问题的反馈....
然而,这就是我将两个微调器点击处理程序分开而不必为它们编写单独的函数的方法。
$('.spinner').click(function(){
$(this).val( parseInt($(this).find('input').val(), 10) + 1);
$(this).slideUp();
});