首页 > 解决方案 > 在 JavaScript 中单击列表时更改下拉列表的方法

问题描述

当我使用 Java 脚本单击页面左侧列表中的替代项时,如何自动更改下拉列表中的替代项?

标签: javascriptajax

解决方案


这部分用于从 Web 服务读取数据并在屏幕中显示它们,并在下拉列表中显示替代方案。问题是,当我单击主菜单时,下拉菜单中与页面左侧的选项相同的选项不会自动更改。这是左侧的代码。

“使用严格”;

var baseURL = " http://api.arbetsformedlingen.se/af/v0 ";

document.addEventListener("DOMContentLoaded", function(){ var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == XMLHttpRequest.DONE ) {
       if (xmlhttp.status == 200) {

            var jsonData = JSON.parse( xmlhttp.responseText );
            document.getElementById("searchlan").innerHTML = "";
            document.getElementById("searchlan").innerHTML = "<option seleted disabled>Hela Sverige</option>";
            for(var i=0; i < jsonData.soklista.sokdata.length; i++){

               document.getElementById("mainnavlist").innerHTML += "<li id='"+jsonData.soklista.sokdata[i].id+"'>"+jsonData.soklista.sokdata[i].namn+" (" + jsonData.soklista.sokdata[i].antal_ledigajobb + ")</li>";
               document.getElementById("searchlan").innerHTML += "<option value='"+jsonData.soklista.sokdata[i].id+"'>"+jsonData.soklista.sokdata[i].namn+"</option>";


            }
       }
       else if (xmlhttp.status == 400) {
          alert('There was an error 400');
       }
       else {
           alert('something else other than 200 was returned');
       }
    }
};

xmlhttp.open("GET", baseURL+"/platsannonser/soklista/lan", true);
xmlhttp.send();

});


推荐阅读