下拉列表的几个问题

问题好像是无止境的，刚解决一个，马上又冒出一个新问题了。
这次是关于下拉列表的。用JS创建了一个简单的动态下拉列表：
function madeadd(){
var madeAdd = document.forms[0].address;
var madeAdd1 = document.forms[0].address1;
if(madeAdd.options[0].selected == true){
madeAdd1.options[0].text = "";
madeAdd1.options[1].text = "";
madeAdd1.options[2].text = "";
madeAdd1.options[3].text = "";
madeAdd1.options[4].text = "";
}
if(madeAdd.options[1].selected == true){
madeAdd1.options[0].text = "";
madeAdd1.options[1].text = "武汉";
madeAdd1.options[2].text = "黄冈";
madeAdd1.options[3].text = "浠水";
madeAdd1.options[4].text = "罗田"; }
if(madeAdd.options[2].selected == true){
madeAdd1.options[0].text = "";
madeAdd1.options[1].text = "长沙";
madeAdd1.options[2].text = "短沙";
madeAdd1.options[3].text = "中沙";
madeAdd1.options[4].text = "大沙"; }
}
下面是HTML部分的代码：
<select name="address" onchange="madeadd()">
<option value=""></option>
<option value="hb">湖北</option>
<option value="hn">湖南</option>
</select>
<select name="address1">
<option value="">&nbsp&nbsp&nbsp&nbsp</option>
<option></option>
<option></option>
<option></option>
<option></option>
<option></option>
<option></option>
<option></option>
</select>
现在的问题是，当我选中列表一和列表二中的选项并提交后，而我再返回表单时，列表二中的选项就会消失。
比如说，我选择了湖北，然后再选择了黄冈。当我提交表单后再返回表单，列表二中的选项就会全部变成空白。但其它选项中的资料不变（比如姓名我填的是张三还是张三)。必须点击一下列表一中的其它选项，再点击湖北，列表二中的选项才能出来。
想向前辈们请教一下问题的原因，该从何解决。

解决方案 »

  1.   

    因为你是通过js加载列表二的选项，但回退时，浏览器不会主动执行js，所以你列表二是空白的。
    现在的js使用越来越频繁，但对浏览器“前进/后退”的支持却一直是个大问题。不过目前的几种流行的js框架好像都实现了这种支持。
      

  2.   

    二楼你好，知道问题出在哪了。用什么办法解决呢？用JS框架吗？能跟我介绍下JS框架吗？
      

  3.   

    可以<iframe 提交，可以保持状态。
    <form name="form1" method="POST" target="ss" action="">
    <select>
    <option></option>
    </select>
    <input type="button" onclick="document.form1.submit()" name='sb' value='submit'>
    </form>
    <iframe style="display:none" name="ss" id="ss"></iframe>
      

  4.   

    你在有select的页面使用选择的值重新初始化select不就行了
      

  5.   

    在提交之后返回一个列表二的选项的id，
    在页面加载的时候把这个id对应的option设为selected
      

  6.   

    补充一点
    判断选没选中直接if(madeAdd.options[2].selected）就好了啊
    为什么要写成if(madeAdd.options[2].selected == true）感觉很奇怪啊。。
      

  7.   


    呵呵~~~
    老乡啊，我是黄冈蕲春的哦
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>selectOptions3.html</title>

        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
         function madeadd(){
    var madeAdd = document.forms[0].address;
    var madeAdd1 = document.forms[0].address1;
    if(madeAdd.options[0].selected == true){
    madeAdd1.options.length = 0;
    madeAdd1.options.add(new Option("s", "s"));
    }

    if(madeAdd.options[1].selected == true){
    madeAdd1.options.length = 0;
                                    //如果动态的下面的这些数据是根据前面选择的从数据库中查询处理的
    madeAdd1.options.add(new Option("武汉", "武汉"));
    madeAdd1.options.add(new Option("黄冈", "黄冈"));
    madeAdd1.options.add(new Option("浠水", "浠水"));
    madeAdd1.options.add(new Option("罗田", "罗田"));
    madeAdd1.options.add(new Option("大冶", "大冶"));
    madeAdd1.options.add(new Option("蕲春", "蕲春"));
    }
    if(madeAdd.options[2].selected == true){
    madeAdd1.options.length = 0;
    madeAdd1.options.add(new Option("长沙", "长沙"));
    madeAdd1.options.add(new Option("南昌", "南昌"));
    }
    }

    window.onload = function () {
    var temp = document.forms[0].address;
    var madeAdd1 = document.forms[0].address1;
    temp.value = "hb";//"之前选择的值";
    if (temp.value == "hb") {
    madeAdd1.options.add(new Option("武汉", "武汉"));
    madeAdd1.options.add(new Option("黄冈", "黄冈"));
    madeAdd1.options.add(new Option("浠水", "浠水"));
    madeAdd1.options.add(new Option("罗田", "罗田"));
    madeAdd1.options.add(new Option("大冶", "大冶"));
    madeAdd1.options.add(new Option("蕲春", "蕲春"));
    }
    if(temp.value == "hn"){
    madeAdd1.options.add(new Option("长沙", "长沙"));
    madeAdd1.options.add(new Option("南昌", "南昌"));
    }
    madeAdd1.value = "蕲春";//第二个文本框选择的值
    };
        
        </script>  </head>
      
      <body>
       <form>
        <select name="address" onchange="madeadd()">
    <option value=""></option>
    <option value="hb">湖北</option>
    <option value="hn">湖南</option>
    </select>
    <select name="address1">
    <option value="">&nbsp;&nbsp;</option>
    </select>
    </form>
      </body>
    </html>
    动态级联类型这种