Aynı sınıfın farklı divs öğelerinden nasıl seçilir?

Question

Burada, bir açılır menüde (1-100 değerleri), seçilen <tr> klonu eklenecektir. Bir kaç farklı seçenekten yararlanmaya çalıştım ama bir şeyleri özlüyorum. Bu kodu çalıştırdığımda ve kullanıcı üst divdaki açılır menüyü değiştirdiğinde, ikinci div alanına alanlar ekler. Biliyorum çünkü sınıflar aynı, divları birbirinden ayırmak için bunları nasıl kandırabilirdim? Div "NewTeam", daha önce yapılan bir seçim temelinde klonlama ile oluşturulur.

Belirli bir div içindeki açılır menünün yalnızca tabloya aynı divdaki satırları eklemesini istiyorum. Kullanıcı girdisine bağlı olarak, bu sınıfla ikiden fazla div olabileceğini unutmayın. newTeam

Yardımı takdir edin!

$(".RosterCountSelect").change(function(){ 
    var numOfPlayers = this.value; 
    c=$('.PlayerRow').length; //How many rows are already shown? 
    for (var i = c; i < numOfPlayers; i++){ 
     $(".PlayerRow").first().clone().insertAfter(".PlayerRow:last"); 
    } 
}); 

HTML işaretleme

<div class="newTeam"> 
<fieldset class="vfb-fieldset vfb-fieldset-1 str8-sports-roster-upload " id="TeamFieldset" style = "display: none"> 
    <div class="vfb-legend"> 
    <h4 style="padding-left: 40px;">New Team - <input class = "TeamName" style = "width:200px" type = "text" placeholder = "Team Name (eg: Girls 5th Grade)"/></h4> 
    <label>Roster Count:</label><select class="RosterCountSelect"> 
    </select> 
    <form> 
     <table> 
      <tr class = "PlayerRow"> 
       <td><input class="teamInput" type="text" placeholder="Player Full Name" /></td> 
       <td><input class="teamInput" type="text" placeholder="Player Number" /> </td> 
       <td><input class="teamInput" type="text" placeholder="Jersey Size" /> </td> 
       <td><input class="teamInput" type="text" placeholder="Short Size" /> </td> 
       <td><input class="teamInput" type="text" placeholder="Male/Female" /> </td> 
      </tr> 
     </table> 
    </form> 
    </div> 
</fieldset> 
</div> 
<div class="newTeam"> 
<fieldset class="teamInfo" id= "TeamFieldset"> 
    <div class="vfb-legend"> 
    <h4 style="padding-left: 40px;">New Team - <input class = "TeamName" style = "width:200px" type = "text" placeholder = "Team Name (eg: Girls 5th Grade)"/></h4> 
    <label>Roster Count:</label><select class="RosterCountSelect"> 
    </select> 
    <form> 
     <table> 
      <tr class = "PlayerRow"> 
       <td><input class="teamInput" type="text" placeholder="Player Full Name" /></td> 
       <td><input class="teamInput" type="text" placeholder="Player Number" /> </td> 
       <td><input class="teamInput" type="text" placeholder="Jersey Size" /> </td> 
       <td><input class="teamInput" type="text" placeholder="Short Size" /> </td> 
       <td><input class="teamInput" type="text" placeholder="Male/Female" /> </td> 
      </tr> 
     </table> 
    </form> 
    </div> 
</fieldset> 
</div> 

Answer 1

Sen yatıştırmak için sadece bir sınıf kullanımını seçebilirsiniz.

$($('.newTeam')[0]) 
$($('.newTeam')[1]) 
... 

Emin değilim, ama bunu deneyin.