Question

我在点击按钮时循环div。但我需要的是最初隐藏.loop div并在按钮点击时显示它。

目前克隆正在完美发生，我唯一需要的是，最初不要显示div.loop。默认情况下仅显示按钮。

这是我当前的代码和 DEMO

clicks = 0;
$('button').on('click', function () {
    if ($('div.loop').length < 5) {
        clicks++;
        newLoopDiv = $($('div.loop')[0]).clone().appendTo(".container");
        $('input', newLoopDiv).each(function (index, element) {
            $(element).attr('name', $(element).attr('name') + clicks);
        });
    }
});

Answer 1

clicks = 0;
$('button').on('click', function () {
  $('div.loop').show();
    if ($('div.loop').length < 5) {
        clicks++;
        if(clicks>1){
            alert("more 1");
            newLoopDiv = $($('div.loop')[0]).clone().appendTo(".container");
            $('input', newLoopDiv).each(function (index, element) {
            $(element).attr('name', $(element).attr('name') + clicks);
        });
        }
        else{
          alert("asd");
        newLoopDiv = $($('div.loop')[0]).appendTo(".container");
            $('input', newLoopDiv).each(function (index, element) {
            $(element).attr('name', $(element).attr('name') + clicks);
        });


    }

    }
});

替换并尝试使用此代码。希望这就是您所需要的......

JSBIN DEMO

Answer 2

这里有几个选项。您可能最初使用CSS隐藏模板，然后在克隆时删除隐藏克隆的CSS。另一种选择是完全使用JavaScript创建“循环”元素，稍后再附加它。

Demo Option 1 - 在第一个div.loop模板上使用隐藏类，使用.removeClass()删除克隆类。

Demo Option 2 - 使用在jQuery中创建的模板，而不是选择shell元素。

注意：我已将first name的名称属性更新为first_name。

最初在jquery clone中隐藏div

2 个答案: