微調不能工作點擊

Question

我已經在我的網站創建了一個簡單的微調，但它不適用於鼠標點擊通過鍵盤使用美女微調工作不知道爲什麼它不通過鼠標點擊我沒有知道這是什麼原因？

我附上下面的代碼，我沒有連接我剛剛附加微調代碼只請參見下面的它

me(".items_container .item_spinner").click(function() { 
    var count = me(".droppable .item_spinner").length;  
    var count = count + 1; 
    var step = me(".step").val(); 
    var li_div = '<li class="item_spinner" id="item_spinner_'+count+'">'; 
    li_div += '<label class="spin_' + count + '"><b>Spinner</b></label><input type="text" id="spinner-3_' + count + '" value="0" />'; 
    li_div += '<input type="button" class="edit" id="editspinner_' + count + '" value="Edit">'; 
    li_div += '<a href="javascript:(void);" class="removeclass" style=""></a>'; 
    li_div += '<div class="editspinnerrange_' + count + '" style="display:none;">'; 
    li_div += '<label>Field Label</label><input type="text" name="spinner_title" class="spinner_label_' + count + '">'; 
    li_div += '<label>Min Range Value</label><input type="text" name="minrange" class="minchange_' + count + '">'; 
    li_div += '<span class="minranges_' + count + '" style="display:none;">-1000</span>'; 
    li_div += '<label>Max Range Value</label><input type="text" name="maxrange" class="maxchange_' + count + '">'; 
    li_div += '<span class="maxranges_' + count + '" style="display:none;">1000</span>'; 
    li_div += '<label>Step Increase</label><input type="text" name="step" class="step_' + count + '"><span class="stepchange_' + count + '" style="display:none;">1</span></div><div class="spinneroptionbox_' + count + '" style="display:none;"><span class="req">Make this field as required <input class="spinneroption_' + count + '" type="checkbox" name="required" ></span></div></li>'; 
    me('.droppable').append(li_div); 
    me(document).on('keyup', '.spinner_label_' + count, function() { 
     me('.spinner_label_'+count).val(me(this).val()); 
     me('.spin_' + count).html('<b>' + me(this).val() + '</b>'); 
    }); 
    me(document).on('keyup', '.maxchange_' + count, function() { 
     this.value = this.value.replace(/[^0-9]/g, ''); 
     var newmax = me('.maxchange_' + count).val(); 
     me('.maxranges_' + count).text(newmax); 
     var newmin = me('.minhange_' + count).val(); 
     me('.minranges_' + count).text(newmin); 
     me('#spinner-3_' + count).spinner({ 
      step: me('.stepchange_' + count).text(), 
      min: me('.minranges_' + count).text(), 
      max: me('.maxranges_' + count).text(), 
     }); 
    }); 
    me(document).on('keyup', '.minchange_' + count, function() { 
     this.value = this.value.replace(/[^0-9]/g, ''); 
     var newmin = me('.minchange_' + count).val(); 
     me('.minranges_' + count).text(newmin); 
     me('#spinner-3_' + count).spinner({ 
      step: me('.stepchange_' + count).text(), 
      min: me('.minranges_' + count).text(), 
      max: me('.maxranges_' + count).text(), 
     }); 
    }); 
    me(document).on('keyup', '.step_' + count, function() { 
     this.value = this.value.replace(/[^0-9]/g, ''); 
     var newstep = me('.step_' + count).val(); 
     me('.stepchange_' + count).text(newstep); 
     me('#spinner-3_' + count).spinner({ 
      step: me('.stepchange_' + count).text(), 
      min: me('.minranges_' + count).text(), 
      max: me('.maxranges_' + count).text(), 
     }); 
    }); 
    me('#spinner-3_' + count).spinner({ 
     step: me('.stepchange_' + count).text(), 
     min: me('.minranges_' + count).text(), 
     max: me('.maxranges_' + count).text(), 
    }); 
    me('#editspinner_' + count).click(function() { 
     $data = me(this).parent().attr('id'); 
     me('.spinneroption_' + count).attr('data-curr', $data); 
     me('.editspinnerrange_' + count).slideToggle("milliseconds"); 
     me('.spinneroptionbox_' + count).slideToggle("milliseconds"); 
    }); 
    me('.spinneroption_' + count).live('change', function() { 
     if (this.checked) { 
      $curr = me(this).attr('data-curr'); 
      me('#' + $curr + ' label').eq(0).after('<span class="required">*</span>'); 
     } else { 
      me(this).parents('li').children('.required').remove();   
     } 
    });  
}); 

HTML整個代碼：

<div id="item_spinner" class="item_spinner ui-widget-content"> 
    <a href="#" class="spipop"> 
     <input type="button" value="Spinner"> 
    </a> 
</div> 

Answer 1

的原因click事件不工作是因爲html dom是動態生成的，需要作爲委託事件來處理。

這應該解決您的問題

jQuery代碼：

 me(document).on('click','#editspinner_'+count,function() { 
     $data = me(this).parent().attr('id'); 
     me('.spinneroption_'+count).attr('data-curr', $data); 
     me('.editspinnerrange_'+count).slideToggle("milliseconds"); 
     me('.spinneroptionbox_'+count).slideToggle("milliseconds"); 
    }); 

REF： http://api.jquery.com/on/

編碼快樂:)