HTML 重新加载下拉值 JavaScript [英] HTML Reload Dropdown Value JavaScript

查看:31
本文介绍了HTML 重新加载下拉值 JavaScript的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个这样的脚本:

<html>
<head></head>
<body>
<select id="first" onchange="deleteitem()">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
    <option value="5">Five</option>
    <option value="6">Six</option>
    <option value="7">Seven</option>
    <option value="8">Eight</option>
    <option value="9">Nine</option>
</select><br >
<select id="second" >
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
    <option value="5">Five</option>
    <option value="6">Six</option>
    <option value="7">Seven</option>
    <option value="8">Eight</option>
    <option value="9">Nine</option>
</select><br >

<script>
    var one = document.getElementById('first');
    var two = document.getElementById('second');

    function deleteitem() {
        for(var i = one.selectedIndex; i >= 0; i--){
            two.remove(i);
            for(var x = one.length;x>=one.selectedIndex+5;x--) {
                two.remove(x);
            }
        }
    }
</script>
</body>
</html>

当用户更改第一个下拉列表时,它会删除第二个下拉列表中的一些项目.

When user change first dropdown, it will remove some items in second dropdown.

我的问题是:当我选择第一个下拉列表而不刷新页面时,如何重新加载第二个下拉列表?

My question is: how can I reload second dropdown when I select first dropdown without refreshing page?

推荐答案

这里已经回答了

function bindDdl() {
            try {
                var ddl = document.getElementById('ddl1');
                var x = PageMethods.GetData('', onsuccess, onfail);
            }
            catch (e) {
                alert(e);
            }
        }
        function onsuccess(result) {
            try {
                var ddl = document.getElementById('ddl1');
                var count= ddl.options.length;
                while (ddl.options.length > 0) {
                    ddl.options.remove(0);
                }

                for (var i = 0; i < result.length-1; i=i+2) {
                    var opt = document.createElement("option");

                    // Assign text and value to Option object
                    opt.text = result[i];
                    opt.value = result[i+1];
                    ddl.options.add(opt);
                }
            }
            catch (e) {
                alert(e);
            }
        }

你可以有这样的 onchange 事件

You can have the onchange event like this

看这里

所以你可以重新加载它但是

So you can reload it but

注意:- 如果您在客户端绑定服务器端控件,它总是会给您一个错误而是在服务器端绑定它们并在客户端添加值最好

这篇关于HTML 重新加载下拉值 JavaScript的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆