小提琴：http://jsfiddle.net/howderek/tzbgA/2/

Question

我有这个html，当有人点击按钮时我正在注入页面。每次使用下面的js单击按钮时，html会再次附加。

<div style="display: none;">
    <div class="grab-me">
    <p>This is fieldset 1</p>
      <input name="foo[]" />
      <input name="bar[]" />
      <input name="oth[]" />
    </div>
 </div>

var count = 1;
  $(function(){
    $('.add-member').live("click", function(e){
        e.preventDefault(e);
        count += 1;
        var grab = $('.grab-me')
                .clone()
                .removeClass('grab-me')
                .appendTo('#register');

    });
 });

但是我需要做的是它说“这是字段集1”我需要每次增加1这个后续追加说这是字段集2，这是字段集3等等我看不到我怎样才能将一个变量（我的计数var）传递给html块，当它被克隆时将替换该数字。

以下是jsfiddle：http://jsfiddle.net/tzbgA/

任何帮助都会很棒！谢谢！

Answer 1

你可以给你想改变课程的句子。然后使用jQuery选择器更改其中的文本。

<body>
  <button class="add-member">add more</button>
  <div style="display: none;">
    <div class="grab-me">
    <p class="count">This is fieldset 1</p>
      <input name="foo[]" />
      <input name="bar[]" />
      <input name="oth[]" />
    </div>
 </div>
  <div id="register">
  </div>
</body>

var count = 1;
$(function(){
    $('.add-member').on("click", function(e){
        e.preventDefault(e);        
        var grab = $('.grab-me')
                .clone()
                .removeClass('grab-me')
                .appendTo('#register')
        .find('p.count').html('This is fieldset '+count);
      count += 1;
    });
 });

Answer 2

添加范围：

 <p>This is fieldset <span>1</span></p> 


   var count = 1;
      $(function(){
        $('.add-member').on("click", function(e){
            e.preventDefault(e);
            count += 1;
            var grab = $('.grab-me')
                    .clone()
                    .removeClass('grab-me')
                    .appendTo('#register');
            $('.span').html('count');

        });
     });

Answer 3

var count = 1;
$(function(){
    $('.add-member').live("click", function(e){
        e.preventDefault(e);
        count += 1;
        var grab = $('.grab-me').clone();
        $(grab p).html('This is fieldset '+count).appendTo('#register');
    });
});

Answer 4

小提琴：http://jsfiddle.net/howderek/tzbgA/2/

这是一个使用8行代码的版本：

代码（Javascript）

var count = 1,
    html = ' <p>This is fieldset #</p><input name="foo[]"/> <input name = "bar[]"/> <input name = "oth[]"/>';
$(function () {
    $('.add-member').live("click", function (e) {
        e.preventDefault(e);
        document.getElementById("register").innerHTML += html.replace("#",++count);
    });
});

将js var传递给通过appendTo添加的html块

4 个答案:

小提琴：http://jsfiddle.net/howderek/tzbgA/2/

代码（Javascript）