根据另一个选定的下拉列表更改下拉列表中的选项值

时间:2016-06-21 23:54:16

标签: javascript html

我有问题从下面的代码更改选项的值,根据其他选择选择哪些更改,但我想更改select id =" numbList"的值,谢谢.. ..

<!DOCTYPE html>
<html>
<body>   

<select id="diffList" onchange="changeList()"> 
  <option value="">-- Difficulty --</option> 
  <option value="1">Easy</option> 
  <option value="2">Medium</option> 
  <option value="3">Difficult</option> 
</select> 

<select id="numbList"></select> 

<script>
window.difficulty = {};
window.difficulty['1'] = [1,2,3];
window.difficulty['2'] = [4,5,6];
window.difficulty['3'] = [7,8,9];

function changeList() {
    var diffList = document.getElementById("diffList");
    var numbRange = document.getElementById("numbList");
    var selectDiff = diffList.options[diffList.selectedIndex].value;
    while(numbRange.options.length)
    {
        numbRange.remove(0);
    }
    var diff = window.difficulty[selectDiff];
    if(diff)
    {
        var i;
        for(i = 0; i < diff.length; i++)
        {
            var difficulty = new Option(diff[i], i);
            numbRange.options.add(difficulty);
        }
    }
}
</script>

</body>
</html>

1 个答案:

答案 0 :(得分:1)

只需对文本和值使用diff [i]选项:

                app.CreatePerOwinContext(Repo.Create);
            app.CreatePerOwinContext<ApplicationUserManager>(ApplicationUserManager.Create);

            app.UseCookieAuthentication(new CookieAuthenticationOptions
            {
                AuthenticationType = DefaultAuthenticationTypes.ApplicationCookie,
                AuthenticationMode = AuthenticationMode.Passive,
                // Comment this out to presist the Identity.User in HttpContext Session
                LoginPath = new PathString("/Account/Login"),
                LogoutPath = new PathString("/Account/Logout"),
                CookieHttpOnly = true,
                CookieSecure = CookieSecureOption.Always,
                CookieDomain = "mydomain.com",
                Provider = new CookieAuthenticationProvider()
                {
                    OnApplyRedirect = ctx =>
                    {
                        if (!IsAjaxRequest(ctx.Request))
                        {
                            ctx.Response.Redirect(ctx.RedirectUri);
                        }
                    }
                }
            });

app.UseOAuthAuthorizationServer(MyAuthOptions.JwtOAuthOptions);

            // Setup webapi 
            app.UseJwtBearerAuthentication(new MyJwtBearerAuthenticationOptions());

当从选择选项中删除先前的值时,它会选择第一个新选项。所以你不需要设置numbList的值。

要以编程方式设置numbList的值,您可以执行... for(i = 0; i < diff.length; i++) { var value = diff[i]; var difficulty = new Option(value, value); numbRange.options.add(difficulty); } ... 例如。