在页面上显示第一个文本框，隐藏有9个文本框，然后每按一个按钮就自动显示下一个文本框，js函数要如果实现?

Question

<div id=1><input type="text" id="1" name="1" value="1" /><input type="button" id="new" name="new" value="+"/></div>
<div id=2><input type="text" id="2" name="2" value="2" /></div>
<div id=3><input type="text" id="3" name="3" value="3" /></div>
<div id=4><input type="text" id="4" name="4" value="4" /></div>
<div id=5><input type="text" id="5" name="5" value="5" /></div>
<div id=6><input type="text" id="6" name="6" value="6" /></div>
<div id=7><input type="text" id="7" name="7" value="7" /></div>
<div id=8><input type="text" id="8" name="8" value="8" /></div>
<div id=9><input type="text" id="9" name="9" value="9" /></div>
<div id=10><input type="text" id="10" name="10" value="10" /></div>要求：在页面上显示第一个文本框，隐藏有9个文本框，然后每按一个按钮就自动显示下一个文本框，
     js函数要如果实现?

Answer 1

<div id=1><input type="text" id="1" name="1" value="1" /><input type="button" id="new" name="new" value="+"/></div>
<div id=2 style="display: none;"><input type="text" id="2" name="2" value="2" /></div>
<div id=3 style="display: none;"><input type="text" id="3" name="3" value="3" /></div>
<div id=4 style="display: none;"><input type="text" id="4" name="4" value="4" /></div>
<div id=5 style="display: none;"><input type="text" id="5" name="5" value="5" /></div>
<div id=6 style="display: none;"><input type="text" id="6" name="6" value="6" /></div>
<div id=7 style="display: none;"><input type="text" id="7" name="7" value="7" /></div>
<div id=8 style="display: none;"><input type="text" id="8" name="8" value="8" /></div>
<div id=9 style="display: none;"><input type="text" id="9" name="9" value="9" /></div>
<div id=10 style="display: none;"><input type="text" id="10" name="10" value="10" /></div>
<script type="text/javascript">
var num = 1;
document.getElementById("new").onclick = function () {
num++;
var obj = document.getElementById(num);
if (obj) {
obj.style.display = "";
}
}
</script>