0

誰かがボタンをクリックしたときにページに挿入するこの 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 などと表示されます。どうすればよいかわかりません変数 (my count var) を html ブロッ​​クに渡して、クローンが作成されたときに、その番号を置き換えます。

ここにjsfiddleがあります：http://jsfiddle.net/tzbgA/

どんな助けでも素晴らしいでしょう！ありがとう！！

4

4 に答える 4

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;
    });
 });
于 2013-03-11T14:02:03.693 に答える
0 
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');
    });
});
于 2013-03-11T14:18:15.067 に答える
0

スパンを追加:

 <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');

        });
     });
于 2013-03-11T13:55:29.113 に答える
0

フィドル: 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);
    });
});
于 2013-03-11T14:24:22.873 に答える