クローンdivとその内部要素

Question

私はDIVをクローンしようとしており、それは内部要素です。すべての内部要素の名前を変更するにはどうすればよいですか？また、私はラジオボタンの関数呼び出しを持っています。私も関数の名前を変更する必要があります。これは私のHTMLコードです。私はどんな助けにも感謝します。

<div id="clonableDiv"> 
    <input id="radio_1" type="radio1" onclick="toggleNames1()" value="Yes" name="Yes"> 
    Yes 
    <br> 
    <input id="radio_2" type="radio1" onclick="toggleNames2()" value="No" name="No"> 
    No 
    <div id="address">Address:</div> 
    <div id="address1"> 
     <input id="address_1" class="textBox" type="text" maxlength="100" name="address_1"> 
    </div> 
    <div id="country_select"> 
     Country: 
     <select id="country_drop_1" name="country_drop_1" onchange="setCountry(this.selectedIndex)"> 
      <option value="-1"></option> 
      <option value="USA">USA</option> 
      <option value="Canada">Canada</option> 
     </select> 
    </div> 
</div> 

Answer 1

は、そのdiv要素のクローンを作成し、すべてのIDと名前を更新してから体内にクローンを挿入する方法です：

var cloneCntr = 1; 
function makeClone() { 
    // clone the div 
    var clone = $("#clonableDiv").clone(false); 
    // change all id values to a new unique value by adding "_cloneX" to the end 
    // where X is a number that increases each time you make a clone 
    $("*", clone).add(clone).each(function() { 
     if (this.id) { 
      this.id = this.id + "_clone" + cloneCntr; 
     } 
     if (this.name) { 
      this.name = this.name + "_clone" + cloneCntr; 
     } 
    }); 
    ++cloneCntr; 
    $(document.body).append(clone);       

} 

のonclickハンドラを更新するには、あなただけobj.onclick = fn;でそれらに新しい値を割り当てることができます。

ここで動作確認できます：http://jsfiddle.net/jfriend00/r2RLw/。

ID値を使用せずクラス名のみを使用した場合、この複製の多くは必要ありませんが、これが送信されて一意の名前値が必要なフォームの一部である場合は、クローン後にこのタイプの固定を行わなければなりません。

Answer 2

あなたは2のいずれかの方法で名前を変更することができます。巧妙な正規表現

クローンのdivでそれに代わる

1. のdivのinnerHTMLプロパティを取得し、実行し、反復処理その子供たちの名前属性を変更する

これらの両方のメリットがありますが、あなたのケースでは2番目です。 http://jsfiddle.net/CQKpP/1/

Answer 3

var cloneCounter = 1; 
var c = $('#clonableDiv').clone(); 
$('input, select', c).each(function(){ 
    var newName = $(this).attr('name'); 
    newName += '_' + cloneCounter; 
    $(this).attr('name', newName); 
}) 
cloneCounter++; 
$('body').append(c); 

あなたは私がここで作られた簡単な例を見ることができます。私は大きな要素のグループをクローンしたいときはいつも、私はIDを使うことから離れ、クラス識別子を使うことに固執します。こうすることで、要素のコレクション全体をクローンし、親クラスとそれに続くクラス階層で一意に識別することができます。例：

これで、一意に識別可能な2つの親要素があり、同じコードを使用してそれらを走査できます。ここで

Answer 4

は、率直に言って、これは単にそれだけの価値はない巨大な頭痛の種のように聞こえる：