在特定区域显示我的下拉框

display my dropdown box in a specific area

本文关键字：我的 显示 区域      更新时间：2023-09-26

好的，这就是我要做的。基于某个下拉值，我正在创建另一个下拉值。根据我现有的代码，是否可以在特定的区域显示下拉列表。

        if (SelectedIndex == 2 || SelectedIndex == 5 || SelectedIndex == 7) {
            $("#DomContainer").remove();
            var MainContainer = document.createElement("Div");
            MainContainer.id = "DomContainer";
            $("body").append(MainContainer);                
            var Options = new Array();
            for(var i=1;i<=28;i++){
               Options.push(i);
            }
            AddDropDown(Options);
        }
    function AddDropDown(Options) {
        var selectHTML = "<label>Day:</label>&nbsp;";
        selectHTML += "<select>";
        for (i = 0; i < Options.length; i = i + 1) {
            selectHTML += "<option value='" + Options[i] + "'>" + Options[i] + "</option>";
        }
        selectHTML += "</select>";
        document.getElementById("DomContainer").innerHTML = selectHTML;
    }
For example <div id="new_drop">//Display the drop down here </div>

只需在AddDropDown中添加第二个参数，即可传递要插入下拉列表的容器的ID：

function AddDropDown(Options, containerId) {
    ...
    document.getElementById(containerId).innerHTML = selectHTML;

然后这样称呼它：

AddDropDown(Options, "new_drop");

（如果我理解正确的话）

无需从DOM中移除和附加元素，只需替换现有的元素内容。。。这是一个简化的版本。

// if "SelectedIndex" is one of the values in the array provided
if ($.inArray(SelectedIndex, [2,5,7])) {
        $("#DomContainer").html("<label>Day:</label>&nbsp;"+inject_dropdown(28));
}    
// Creates and returns a new drop-down based on the "length" provided
function inject_dropdown(length){
    var selectHTML = "<select>";
    for( i=1; i<=length; i++ ){
        selectHTML += "<option value='" + i + "'>" + i + "</option>"
    }
    selectHTML += "</select>"
    return selectHTML;
}

将$('#DomContainer')选择器替换为标识新下拉列表显示位置的任何选择器。

相关文章：