2013-01-23 96 views
-1

我有幾個要素是這樣的:JQuery的 - 克隆元素和變化的多重屬性,屬性

<div class="image_insert clearfix"> 
    <label for="userfile3">Image 3</label> 
    <input type="file" name="userfile3" id="userfile3"> 
    <label for="slika_naziv_eng3">Image Title</label> 
    <input type="text" name="slika_naziv_eng3" id="slika_naziv_eng3"/> 
    </div> 

和JS克隆:

var img_add = $('.img_add'); 

img_add.on('click', function(){ 
    var img_ins = $('.image_insert'), 
    i = img_ins.length, 
    clon = img_ins.first().clone().attr({'class' : 'image_insert clearfix', 'name' : 'userfile' + i}).insertAfter(img_ins.last()); 
}); 

我需要改變所有的屬性,其中有一個數字。每次添加新元素時,都需要計算元素的數量,新數字將是元素的數量+1。我該如何做到這一點?

+0

您已經擁有'i'這是元素的數量,因此您在設置屬性值時想使用'(i + 1)'。 –

+0

其中是 - $('。img_add')的html img元素; ? – wmitchell

+0

@wmitchell個人認爲這與問題完全無關。 –

回答

0

我從寫在過去

$("#containerDiv").find("div").each(function(){ 
    lastVersionNumber = jQuery(this).attr("id").replace(/\D/g, "")/1; 
}); 
newVersionNumber = lastVersionNumber + 1; 

# build the new version HTML string 
var sHTML = "<div name='mydiv'>"; 
sHTML += jQuery("#templateCode").html() 
sHTML = sHTML.replace(/<input/i, "<input name='v"+newVersionNumber+"_name'"); 
sHTML += "</div>"; 


$("#containerDiv").append(sHTML); 
0

類似的東西ID抓住這個試試這個:酷龍包含了新的元素,因此,你需要找到你的元素

<!DOCTYPE html> 
    <html> 
    <head> 
    <title>Clone Elements with Jquery by @MaoAiz + Sasha</title> 
    </head> 
    <body> 
    <button class="img_add">New</button> 
    <div class="image_insert clearfix"> 
     <label for="userfile1" class="img-label">Image 1</label> 
     <input type="file" name="userfile1" id="userfile1"> 
     <label for="slika_naziv_eng1">Image Title</label> 
     <input type="text" name="slika_naziv_eng1" id="slika_naziv_eng1"/> 
    </div> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 
    <script> 
     var img_add = $('.img_add'); 

     img_add.on('click', function(){ 
      var img_ins = $('.image_insert'), 
      i = img_ins.length + 1; 
      clon = img_ins.first().clone().insertAfter(img_ins.last()); 
      // clon contains the new element, so, you need to find your element 
      clon.find("input").first().attr({ 
      'name' : 'userfile' + i, 
      'id' : 'userfile' + i 
      }); 
      clon.find("input").last().attr({ 
      'name' : 'slika_naziv_eng' + i, 
      'id' : 'slika_naziv_eng' + i 
      }); 
      //plus: 
      clon.find(".img-label").text("Image " + i) 
      // view you cosole in Chrome Ctrl + Shift + j 
      console.log("Elements: " + i) 
     }); 
    </script> 
    </body> 
    </html> 

我有github中的演示。 https://github.com/MaoAiz/Formulario-Dinamico-JQuery