Блог

Я новичок в jQuery, и у меня возникли некоторые проблемы с функцией Clone().

Мой вопрос в том, как я могу ограничить количество раз, когда ответы могут быть клонированы? Должен ли я объявлять переменную и запускать ее через цикл, пока не будет достигнуто желаемое число?

Вот .aspx

 > <div id="answer_wrapper">
>     <div id="answer">
>         <h3 class="new">Answer 1</h3>
>         <asp:TextBox ID="QuestionAnswer1" runat="server" CssClass="form" Width="300px"></asp:TextBox>
>     </div>
>     <h3 class="new">Answer 2</h3>
>     <asp:TextBox ID="QuestionAnswer2" runat="server" CssClass="form" Width="300px"></asp:TextBox>
> </div> <!-- end answer_wrapper -->
> <br />
> <asp:Button ID="ga" runat="server" CssClass="button_add_question" style="border: 0px;" />
> <a id="foo" href="#">Duplicate</a>

> <script type="text/javascript">
>     $('#foo').click(function () {
>     $('#answer').clone().appendTo('#answer_wrapper');
>     });
> </script>
 

Любая помощь была бы очень признательна, поскольку я действительно не знаю, как подойти к этому.

Похоже, что ваш код приведет к созданию нескольких элементов с одинаковым идентификатором, что не идеально, но чтобы ответить на ваш вопрос, возможно, сделайте это:

 <script type="text/javascript">
     var limit = 10;
     $('#foo').click(function () {
         if($('#answer').length < limit) {
             $('#answer').clone().appendTo('#answer_wrapper');
         }
     });
</script>
 

Вы можете либо ограничить количество клонированных divs, установив var вне события click и увеличив его значение, либо вы можете подсчитать количество divs.

Я ожидаю, что вы тоже захотите изменить или удалить идентификатор.

 <script type="text/javascript">
    var count = 1;
    $('#foo').click(function () {
        if(count < 5) {
            $('#answer').clone().attr({ 'id': 'answer'   count }).appendTo('#answer_wrapper');
            //$('#answer').clone().removeAttr('id').appendTo('#answer_wrapper'); // remove the attribute
            count  ;
        }
    });
</script>
 

подсчет divs:

 <script type="text/javascript">
    $('#foo').click(function () {
        if($('.answer').length < 5) { // Hope you add a class to the answer
            $('#answer').clone().addClass('answer').removeAttr('id').appendTo('#answer_wrapper');
        }
    });
</script>