Question

我是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>

任何帮助都会非常感激，因为我真的不知道如何处理这个问题。

Answer 1

看起来您的代码会导致创建具有相同ID的多个元素，这不是理想的，但要回答您的问题，可能会这样做：

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

Answer 2

您可以通过设置var外部点击事件并增加其值来限制克隆的div数量，也可以计算div数量。

我希望您也想要更改或删除ID。

<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>

我怎样才能限制JQuery Cloned Divs的数量？

2 个答案: