怎么样实现select框点击时才加载选项列表？

Question

就是页面生成时下拉框中没有选项，在点击打开下拉框时才读取数据加载到下拉框中。
用什么事件或者是用什么方法实现？

Answer 1

这个我做过<select name='EEyesServerId' id='EEyesServerId' onclick='getServerList();'>
<option value='0'>-请选择-</option>
</select>
<script>getServerList();</script>        //获取服务器列表
        function getServerList() {
            //如果列表已存在,返回
            //alert($("#EEyesServerId option").length);
            if ($("#EEyesServerId option").length > 1) return false;
            
            $.getJSON("/Admin/GetServerList/",
                function(json) {
                    //$("#EEyesServerId option[@val='0']").text("-请选择-");
                    if (json.result == "false") {
                        showMsg(json.msg, 'e');
                        return false;
                    }
                    len = json.serverList.length;                    
                    for (i = 1; i < len; i++) {
                        $("<option value='" + json.serverList[i].id + "'>" + json.serverList[i].name + "</option>").appendTo($("#EEyesServerId"));
                    }
                }
            );
        }

Answer 2

如果数据是固定不变的，就在页面加载的时候把数据放到一个数组里面，然后再点击select的时候加载数据。
如果数据是变化的，就只能每次从服务器取了。。可以参考楼上的方法

Answer 3

应用Ajax  可以引用AjaxPro.dll
触发客户端事件 前台函数调用后台方法返回数据集可以是  dataset  也可以是xml
然后解析数据集  将项目加载到select中仅供参考:     var ds=NameSpaceSearchItem.SearchItems.BindItemToListBox(selectedValue).value;
            if(ds != null && typeof(ds) == "object" && ds.Tables != null)
            {
                for(i=0;i<ds.Tables[0].Rows.length;i++)
                {
                     var category=ds.Tables[0].Rows[i].Category;
                     //var evalType=ds.Tables[0].Rows[i].EvalType;
                     var itemID=ds.Tables[0].Rows[i].ItemID;
                     var catID=ds.Tables[0].Rows[i].CatID;
                     var selectedItemID=itemID+"|"+catID;
                     document.getElementById("ListBoxShowItem").options.add(new Option(category,selectedItemID));//添加项
                }
            }