Javascript号码选择器功能

Question

我有一个号码选择器，其功能完美。但是，无论何时我想拥有3个使用相同功能的号码选取器，它们都会一起运作（我的意思是当我按下时，所有三个号码都在上升）。我怎样才能使所有三个数字采撷功能相互独立，只使用一个功能？

（这个例子是一个数字选择器。该功能工作，但我需要2个以上的多个选择器来使用此功能，但彼此独立工作）

var tableSpinnerRow = $('<div class="row"/>').appendTo(tabPage); 
     var spinnerContainer = $('<div class=" container col-xs-12 "/>').appendTo(tableSpinnerRow); 
     $('<div class="col-xs-2"><b>Columns: from</b></div>').appendTo(spinnerContainer); 
     var a = $('<div class="col-xs-2"/>').appendTo(spinnerContainer); 
     var spinner1 = $('<div class=" input-group spinner"/>').appendTo(a); 
     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); 

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

Answer 1

您可以复制使用 功能。 CONCAT（） ，让你有多个实例

Answer 2

你的代码更改为这对我来说工作得很好

var tableSpinnerRow = $('<div class="row">').appendTo(tabPage); 
var spinnerContainer = $('<div class=" container col-xs-12 ">').appendTo(tableSpinnerRow); 
$('<div class="col-xs-2"><b>Columns: from</b></div>').appendTo(spinnerContainer); 
var a = $('<div class="col-xs-2">').appendTo(spinnerContainer); 
var spinner1 = $('<div class=" input-group spinner">').appendTo(a); 
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="plus btn btn-default"><i class="fa fa-caret-up"></i></button>').appendTo(input_Group1); 
var buttonMinus1 = $('<button class="minus btn btn-default"><i class="fa fa-caret-down"></i></button>').appendTo(input_Group1); 

$('.minus, .plus').on('click', function() { 
    var self = $(this); 
    var input = self.parents(".input-group:first").find(".form-control"); 
    input.val(parseInt(input.val()) + (self.hasClass("plus") ? 1 : -1)); 
});