页面刷新不会重新填充从之前的选择DropDownList

Question

我有一个HTML网站，当在一个DropDownList中选择一个值时，根据您的选择填充第二个列表。当刷新页面或从重定向页面返回时，第一个DropDownList仍然是您首次选择的值，但不会填充第二个DropDownList。修复？

如果您愿意，您可以查看我在GiveToTheYToday.org上描述的问题。

</style> 
    <script type="text/javascript"> 
     function populate(br,ca){ 
      var br = document.getElementById(br); 
      var ca = document.getElementById(ca); 
      ca.innerHTML = ""; 
      if(br.value == "ASO"){ 
       var optionArray = ["|","/aso/barbara_lankford.html|Barbara Lankford", 
       "/aso/howard_holloman.html|Howard Holloman","/aso/tricia_burke.html|Tricia Burke"] 
      } 
      else if(br.value == "Bullitt County"){ 
       var optionArray = ["|","home.html|"] 
      } 
      else if(br.value == "Chestnut Street"){ 
       var optionArray = ["|","home.html|"] 
      } 
      else if(br.value == "Clark County"){ 
       var optionArray = ["|", "/clark/colita_moore.html|Colita Moore", 
       "/clark/rachel_hollensead.html|Rachel Hollensead"] 
      } 
      else if(br.value == "Downtown"){ 
       var optionArray = ["|","/downtown/debbie_eberenz.html|Debbire Eberenz", 
       "/downtown/gaylee_gillim.html|Gaylee Gillim"] 
      } 
      else if(br.value == "Floyd County"){ 
       var optionArray = ["|","/floyd/robyn_beard.html|Robyn Beard", 
       "/floyd/shane_thomas.html|Shane Thomas"] 
      } 
      else if(br.value == "Northeast"){ 
       var optionArray = ["|","/northeast/adam_johnson.html|Adam Johnson", "/northeast/amy_mcclain.html|Amy McClain", 
       "/northeast/ashley_hopkins.html|Ashley Hopkins", "/northeast/brandon_white.html|Brandon White", 
       "/northeast/dale_burnham.html|Dale Burnham", 
       "/northeast/dee_fairfield.html|Dee Fairfield", "/northeast/doug_roemer.html|Doug Roemer", 
       "/northeast/jack_danehy.html|Jack Danehy", "/northeast/jennifer_broadbridge.html|Jennifer Broadbridge", 
       "/northeast/jessica_tretter.html|Jessica Tretter", "/northeast/joey_skidmore.html|Joey Skidmore", 
       "/northeast/lindsey_brown.html|Lindsey Brown", "/northeast/lori_fitzgerald.html|Lori Fitzgerald", 
       "/northeast/mac_brown.html|Mac Brown", 
       "/northeast/megan_schulte.html|Megan Schulte", "/northeast/melanie_vittitow.html|Melanie Vittitow", 
       "/northeast/michael_ngong.html|Michael Ngong", "/northeast/morgan_white.html|Morgan White", 
       "/northeast/ralph_piercy.html|Ralph Piercy", "/northeast/ron_burse.html|Ron Burse", 
       "/northeast/roscelle_griffin.html|Roscelle Griffin","/northeast/rudy_havira.html|Rudy Havira", 
       "/northeast/semra_meredith.html|Semra Meredith", "/northeast/sheila_pierce.html|Sheila Pierce", 
       "/northeast/stephanie_morgan-white.html|Stephanie Morgan-White", "/northeast/terry_smith.html|Terry Smith", 
       "/northeast/valerie_chinn.html|Valerie Chinn"] 
      } 
      else if(br.value == "Norton Commons"){ 
       var optionArray = ["|","/norton_commons/allyson_vitato.html|Allyson Vitato", 
       "/norton_commons/ashley_porter.html|Ashley Porter"] 
      } 
      else if(br.value == "Oldham County"){ 
       var optionArray = ["|","/oldham/kristin_compton.html|Kristin Compton"] 
      } 
      else if(br.value == "School-Age Child Care"){ 
       var optionArray = ["|","/sacc/brandon_yates.html|Brandon Yates"] 
      } 
      else if(br.value == "Southeast"){ 
       var optionArray = ["|","/southeast/chuck_jackson.html|Chuck Jackson", "/southeast/crysten_minzenberger.html|Crysten Minzenberger", 
       "/southeast/john_odom.html|John Odom","/southeast/john_oliva.html|John Oliva", 
       "/southeast/kristina_kluesner.html|Kristina Kluesner","/southeast/lakesha_washington.html|LaKesha Washington", 
       "/southeast/steve_sexton.html|Steve Sexton"] 
      } 
      else if(br.value == "Southwest"){ 
       var optionArray = ["|", "/southwest/ashtyn_begley.html|Ashtyn Begley", 
       "/southwest/deonna_tinsley.html|Deonna Tinsley", 
       "/southwest/joseph_tindle.html|Joseph Tindle", 
       "/southwest/jenifer_roberts.html|Jenifer Roberts"] 
      } 
      for(var option in optionArray){ 
       var pair = optionArray[option].split("|"); 
       var newOption = document.createElement("option"); 
       newOption.value = pair[0]; 
       newOption.innerHTML = pair[1]; 
       ca.options.add(newOption); 
      } 
     } 
    </script><!--[if lt IE 9]> 
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
<![endif]--> 
</head> 
<body> 
<div class="container"> 
<header><img alt="" height="239" src="http://givetotheytoday.org/campaign_files/2016_header.jpg" width="960" /></header> 

<div class="sidebar1"> 
<nav> 
<ul> 
    <li> 
    <div align="center"><img alt="" height="auto" src="http://givetotheytoday.org/campaign_files/general.png" width="300" /></div> 
    </li> 
    <li><a href="http://givetotheytoday.org"><img alt="" height="174" src="http://givetotheytoday.org/campaign_files/give_today.png" width="278" /></a></li> 
    <li> 
    <div align="center"><iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/6q1zUyecvt4" style="border: 3px solid #EEE;" width="290"></iframe><!-- end .content --></div> 
    </li> 
</ul> 
<!-- end .sidebar1 --></nav> 
</div> 

<article class="content"> 
<section> 
<p>&nbsp;</p> 

<p>In 2016, <b>over 16,000 people experienced our local YMCA because of the generous support of our compassionate Louisville community.</b> With your support, we can make sure that everyone who needs the Y has the opportunity to learn, grow and thrive.</p> 

<p>To navigate to a campaigner, select their appropriate YMCA branch and campaigner name below:</p> 

<hr /> 
<div align="center"> 
<form>Select a Branch: <select id="Branch" name="Branch" onchange="populate(this.id,'Campaigner')"><option value=""></option><option value="ASO">ASO</option><option value="Bullitt County">Bullitt County</option><option value="Chestnut Street">Chestnut Street</option><option value="Clark County">Clark County</option><option value="Downtown">Downtown</option><option value="Floyd County">Floyd County</option><option value="Northeast">Northeast</option><option value="Norton Commons">Norton Commons</option><option value="Oldham County">Oldham County</option><option value="School-Age Child Care">School-Age Child Care</option><option value="Southeast">Southeast</option><option value="Southwest">Southwest</option> </select><br /> 
Select a Campaigner: <select id="Campaigner" name="Campaigner" onchange="window.location.href=this.value"></select></form> 

Answer 1

您的函数仅在加载脚本时运行。当您从浏览器返回时，脚本不会再次加载，因为它已经存在于您的html文件中。

一个简单的解决方法是“监听”DOM事件并相应地执行该功能。例如：

document.addEventListener("DOMContentLoaded", function() { 
    populate(); 
}); 

这样你的函数将在每次加载DOM时执行。

更多关于DOM事件：https://developer.mozilla.org/en-US/docs/Web/Events

附注：为什么你在你的函数有两个参数（从未使用过）？

UPDATE

我看着你的代码，住得近一些，它原来是你总是调用函数传递“分公司”作为第一个参数，“运动家”作为第二。所以，你可以调用你的函数正如我以前说过，但你需要这两个参数传递作为字符串：如果

populate('Branch', 'Campaigner');