2012-08-01 92 views
0

所以,我在這裏要做的是onClick添加另一個<li>,它完全像它上面那個。我已經在PHP中創建了一個for循環來在這個<li>中創建適當的字段。jQuery添加新字段

我正在運行的問題是:當您單擊.repatable-add按鈕時,我得到兩次「替換前」警報,「替換後」警報根本不會觸發。 和想法?

jQuery('.repeatable-add').click(function() { 
    field = jQuery(this).siblings('ul.image-details').find('li:last').clone(true); 
    fieldLocation = jQuery(this).siblings('ul.image-details').find('li:last'); 
    jQuery('input', field).val('').attr('name', function(index, name) { 
      alert(name +' before replace'); 
      return name.replace(/(\d+)/, function(fullMatch, n) { 
      return Number(n) + 1; 
      alert(name +' after replace'); 
     }); 
    }) 
    field.insertAfter(fieldLocation, jQuery(this).siblings('ul.image-details').find('li:last')) 
    return false; 
}); 

回答

0

我在這個地方發佈了這個答案,不知道發生了什麼事。

這是因爲你在返回後試圖做出警報,所以它不會觸發。

我不知道你正在嘗試與輸入的東西做什麼,但這裏是我想出了一個解決方案:

<script type="text/javascript"> 
jQuery(document).ready(function(){ 
    jQuery('.repeatable-add').click(function(){ 
      var copyThis = jQuery(".image-details").find("li:last").attr('outerHTML'); 
      jQuery(".image-details").append(copyThis); 
      var name = jQuery("input").attr("name"); 
      var count = name.replace(/\D+/, ''); 
      var newCount = count++; 
      jQuery("input").attr("name",name.replace(newCount.toString(),count.toString())); 
     return false; 
    }); 
}); 
</script> 

<ul class="image-details"> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
    <li>4</li> 
</ul> 
<input name="ithas1" /> 
<button class='repeatable-add'>button</button>