首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

不刷新 如何显示小弟我隐藏的文本框?

2012-06-02 
不刷新 怎么显示我隐藏的文本框???我在界面上有一个添加的 按钮。。。我一点添加按钮,页面就把我开始隐藏 的

不刷新 怎么显示我隐藏的文本框???
我在界面上有一个添加的 按钮。。。

我一点添加按钮,页面就把我开始隐藏 的文本框 显示出来???


但页面不刷新 。。。

能不能实现、、?


[解决办法]

HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style>div{display:none;}</style><body><div>    <input type="text" />    <input type="text" /></div><div>    <input type="text" />    <input type="text" /></div><div>    <input type="text" />    <input type="text" /></div><input type="button" value="click me" id="btn" /><script type="text/javascript">    var divs = document.getElementsByTagName('div');    var count = 0;    document.getElementById('btn').onclick = function(){        if(divs[count]){            divs[count].style.display = 'block';            count++;        }    };</script></body></html>
[解决办法]
HTML code
<!DOCTYPE html><html><head>  <script src="jquery162.js"></script></head><body><input type="button" value="点击添加" onclick="show()"/><hr style="display:none"/><input type="text" style="display:none" id="txt"/><input type="text" style="display:none" id="txt"/><hr style="display:none"/><input type="text" style="display:none" id="txt"/><input type="text" style="display:none" id="txt"/><hr style="display:none"/><input type="text" style="display:none" id="txt"/><input type="text" style="display:none" id="txt"/><input type="button" value="点击隐藏" onclick="hide()"/><script>var i=1;var texts=document.getElementsByTagName('input');var hrs=document.getElementsByTagName('hr');function show(){if(i<=6){var j=(i-1)/2;    hrs[j].style.display='block';    texts[i].style.display='block';    texts[++i].style.display='block';    i++;}}function hide(){    if(i>2){    j=(i-2)/2;    hrs[j].style.display='none';    texts[--i].style.display='none';    texts[--i].style.display='none';        }}</script></body></html> 

热点排行