Question

我使用了依赖项下拉列表。

 <html>
 <body>
  <select id="parent-cat" name="parent-cat" onchange="getChildrenList(this.value)">    
            <option value ="">- Please Select -</option>               
                <option value="1">test1</option> 
                <option value="2">test2</option> 
                <option value="3">test2</option>                        
        </select>

     <select id="child-cat" name="child-cat" 
        onchange="getChildUrl(this.value)">    
            <option value ="">- Product category -</option>
        </select>

    <script>    
function getChildrenList(parentId) {
    if(parentId !=''){
        var customurl = "result.php";
        jQuery.ajax({
             url: customurl,
             type: "POST",
             data : 'category_id='+parentId,
             dataType: 'json',
             success : function(result) {                
                var optionHtml; 
                optionHtml +='<option value="">-Product Category-</option>';                
                for(var option of result){
                  optionHtml +='<option value="'+option.url+'">'+option.name+'</option>';
                }
                jQuery('#child-cat').html(optionHtml);
             }
        }); 
   }
}

function getChildUrl(childUrl) {
    var url = childUrl; 
      if (url) { 
          window.location = url; // redirect
      }
      return false;
 }
</script>

  </body>
 </html>

一旦将第一个下拉列表更改，我会将结果追加到下一个下拉列表中。

我的问题是，选择第二个下拉列表后，它会重定向到url，但未选中该选项。

我正在寻找代码，在更改了第二个下拉菜单后，一旦重定向了网址，如何同时选择两个下拉菜单。

请任何人帮助我。谢谢

Answer 1

我相信您的问题出在 getChildrenList 函数中。您永远不会检查您的 url 是否与您当前添加的选项相同，并且您永远不会向选项添加 select 参数，因此即使您导航到该 url，它也不会保持选中状态。由于您生成下拉列表的方式（即每次加载页面时都在客户端重新生成它），您还需要在每次打开页面时检查是否在客户端选择了该选项。请注意，我尚未验证以下解决方案是否有效。

function getChildrenList(parentId) {
    if(parentId !=''){
        var customurl = "result.php";
        jQuery.ajax({
             url: customurl,
             type: "POST",
             data : 'category_id='+parentId,
             dataType: 'json',
             success : function(result) {
                var optionHtml; 
                optionHtml +='<option value="">-Product Category-</option>';                
                for(var option of result){
                  var selected = (window.location == option.url) ? "selected=\"selected\"" : ""
                  optionHtml +='<option value="'+option.url+'" '+selected+'>'+option.name+'</option>';
                }
                jQuery('#child-cat').html(optionHtml);
             }
        }); 
   }
}

选择元素中的重定向问题

1 个答案: