2009-12-16 81 views
1

曾经,我在IE6中得到预期的结果,但不是FF(或Chrome)。为什么我的选择框在添加新选择框后重置?

我有一个使用JS动态生成的选择框(列出位置)。 我有一个按钮,允许用户添加更多的选择框,以便他们可以选择多个位置。

当JS代码添加新的选择框时,已经存在的选择框变为'重置'。 例如:我在第一个选择框中选择一个选项,单击按钮添加一个新的选择框,添加一个新的选择框并显示第一个选项,但我的第一个选择框也会重置为第一个选项,反对我已经选择的选项。

这就像网页刷新,但它不是。

我不知道错了什么,我已经尝试给每个盒子分配唯一的ID,以不存在为准。下面是代码:

HTML:

<!-- BEGIN select location box - "slb" --> 
    <div id="selectLocationBox"> 
     <div id="slb_top"> 
      select location(s) you wish to view results for: 
     </div> 
     <div id="slb_mid"> 
      <script language="javascript"> 
       add_LocationBar() 
      </script> 
     </div> 
     <div id="slb_bot"> 
      <a onclick="add_LocationBar()">add another location</a>    
      <input id="loc_hiddenInpt" type="hidden" runat="server" />  <!-- this hidden input box is used to save the part of query dealing with locations, JS will check any location drop down boxes and then put applicable part of query in this hidden input so ASP page can use it --> 
     </div> 
    </div> 

    <!-- END select location box - "slb" --> 

JS代码:

function add_LocationBar() { 

//create and populate array 
var ary_locations = new Array("SELECT", "--select--", "ABE", "Aberdeen, Scotland", "ABU", "Abu Dhabi, United Arab Emirates", "AAB", "Addis Ababa, Ethiopia", "ADD", "Addlestone, United Kingdom", "AKA", "Akasaka, Japan", "ALB", "Al Bidah, Kuwait", "ABA", "Albacete, Spain"); 

//create select drop down box 
var loc_select = document.createElement("select"); 

//populate select box with options from array 
for (var c = 0; c < ary_locations.length; c=c+2) { 
    var opt1 = document.createElement("option"); 
    opt1.value = ary_locations[c] 
    opt1.text = ary_locations[c+1] 
    loc_select.options.add(opt1); 
} 
//add drop down to box 
document.getElementById("slb_mid").appendChild(loc_select); 
document.getElementById("slb_mid").innerHTML += "<br />" 
} 

预先感谢您的任何帮助/洞察力,你可以提供!

回答

1

当您使用innerHTML添加换行符时,会出现问题。尝试再次使用的appendChild像下面

document.getElementById("slb_mid").appendChild(loc_select); 
document.getElementById("slb_mid").appendChild(document.createElement("br")) 

至于我可以告诉浏览器的innerHTML值是不是最新的当前选择的某些原因。所以浏览器抓取innerHTML的当前值,附加<br/>并刷新元素,擦除您的选择。尽管如此,这应该会让你感到满意。

+0

你的建议奏效,非常感谢Shaun! – Seth 2009-12-16 20:59:05

相关问题