javascript - 每次点击一个一个地显示 3 个 div

Question

每次单击+ 添加更多 链接时，我需要一个帮助来一个一个地显示 3 个 div，同时 + 添加更多 链接在显示第 3 个后消失分区请帮助我

<input size="20" id="high_light1" type="text" /> 
 <span><a href="#" id="add"> + Add more</a></span>
 <div style="display:none;"><input size="20" id="high_light2" type="text" /></div>
 <div style="display:none;"><input size="20" id="high_light3" type="text" /></div>
 <div style="display:none;"><input size="20" id="high_light4" type="text" /></div>

注意:我不想生成新的 div，我需要在每次点击时生成现有 div 的 display:block。

谢谢

Answer 1

如果您将使用 jQuery:

$('#add').click(function () {
    $('.toAdd').each(function () {
        if ($(this).css('display') == 'none') {
            $(this).css('display', 'block');
            return false;
        }
    });
    var i = 0;
    $('.toAdd').each(function () {
        if ($(this).css('display') != 'none') {
            i++;
        }
    });

    if (i == 3) $('#add').hide();
});

在这里查看:http://jsfiddle.net/SFRgz/