Question

我正在尝试调整现有的.html文件来添加功能。我对前端开发环境非常陌生。

<form action="javascript:void(0);">
    <input type="button" name="Load" value="Load" onclick="fileLoad();"/>
    <input type="button" name="showFiles" value="Select File" onclick="selectFiles();"/>
</form>

我想要一个下拉列表（动态列表）。单击按钮"Select File"时会发生这种情况。我试图使用selectFiles()函数来实现这一目标。尽管如此，我可以从后端获取文件列表。我如何在前端显示它

Answer 1

从服务器上获取列表后，

function makeList(fileNames) {
    // create a container for the select in your html
    var myDiv = document.getElementById("myDiv");  
    // Create and append select list
    var selectList = document.createElement("select");
    selectList.id = "filesSelect";
    myDiv.appendChild(selectList);

    // Create and append the options
    for (var i = 0; i < fileNames.length; i++) {
        var option = document.createElement("option");
        option.value = fileNames[i]; // this will depend on the datastructure of your list items
        option.text = fileNames[i]; // this will depend on the datastructure of your list items
        selectList.appendChild(option);
    }
}

此功能应作为服务器调用的回调。

我没有测试过，但它应该给你一个明确的想法。

文件选择的动态下拉列表

1 个答案: