TouchSpin插件不能在動態加載的元素上工作

Question

所以，我正在動態地創建一個帶有輸入文本的div。我正在申請這樣的touchSpin()。

$(".commission").TouchSpin({ 
     min: 0, 
     max: 2, 
     step: 0.0001, 
     decimals: 4, 
     boostat: 5, 
     maxboostedstep: 10, 
     buttondown_class: 'btn btn-white', 
     buttonup_class: 'btn btn-white' 
    }); 

此相同的代碼進行工作時，i將內容是靜態的，但現在用Ajax調用它的加載，和插件亙古不工作

<div class="col-md-12"> 
    <div class="col-md-9 col-sm-9 col-xs-9 pad"> 
    <input class="commission" type="text" value="0"> 
    </div> 
    <div class="col-md-3 col-sm-3 col-xs-3 pad"> 
    <button class="btn btn-primary btn-sm pull-right view_btn1" data-toggle="modal" data-target="#view_details" type="button"><i class="fa fa-eye"></i></button> 
    </div> 
    <div class="clearfix"></div> 
</div> 

任何一個能提出好的建議。

Answer 1

you can write TouchSpin code inside ajax success function. like this: 

          $.ajax({ 
          url: "/productos/fillItemView", 
          type:"GET", 
          data: {datos: JSON.stringify(data)}, 
          dataType: "html", 
          contentType: "application/json; charset=UTF-8", 
          success: function(result){ 

          $("#initTr").after(result); //insert dynamic input with inputClass class in view 


          $(".inputClass").TouchSpin({ 
           min: 0, 
           max: 100, 
           step: 1, 
           decimals: 0, 
          }).on('change', function(){ 
           //maybe optional 
          }); 
          }, 
          error : function(xhr, status) { 
            console.log(xhr.responseText); 
            console.log(status); 
          }, 
         }) 
         .done(function(result){ 
         }); 

問候。