javascript - ajax隐藏和显示

Question

我有这个 html 代码

<div id="a1"><input type="text" id="ac1" /></div>
<div id="a2" style="display:none"><input type="text" id="ac2" /></div>
<div id="a3" style="display:none"><input type="text" id="ac3" /></div>
<div id="a4" style="display:none"><input type="text" id="ac4" /></div>
<div id="a5" style="display:none"><input type="text" id="ac5" /></div>
<div id="a6" style="display:none"><input type="text" id="ac6" /></div><span id="close" style="display:none">X</span>
<div><input type="button" id="add" value="add" /></div>

这段代码由 javascript

var i = 2;
$(document).ready(function(){
    $("#add").click(function(){
    if(i <= 6){
        $("#a"+i).show(500);
        ++i;
        if (i == 7){ $(this).hide(500); }
        if (i >= 2){ $("#close").show(500); }
    }
    });

    $("#close").click(function(){
        --i;
        $("#a"+i).hide(500);
        $("#ac"+i).val("");
        if (i == 2){ $(this).hide(500); }
        if (i == 6){ $("#add").show(500); }
    });
});

我需要单击添加按钮时，我需要隐藏最后一个并在其上方添加新按钮

Answer 1

我认为你可以简单地颠倒你的 html 输入的顺序

<div id="a6" style="display:none"><input type="text" id="ac6" />
<div id="a5" style="display:none"><input type="text" id="ac5" /></div>

a4
a3
a2
a1