动态填充表格每一行的下拉列表

Question

我有一个包含 n 行的表格，具体取决于结果。 页面顶部有一个下拉菜单。 根据该下拉列表的选择，我想根据 xhttp.response 使用自己的下拉列表动态填充每行上的一列。

这是我到目前为止：

function getJobs(taskID){

        var xhttp = new XMLHttpRequest();
        var url = "dynamicdd.php";
        var data = new FormData();
        data.append('taskID', taskID);
        xhttp.open('POST', url, true);
        xhttp.send(data);
        $('#cTable tr').each(function(){
            xhttp.onreadystatechange = function() {
                if (xhttp.readyState == 4 && xhttp.status == 200) {
                document.getElementById("testSelect").innerHTML = xhttp.responseText;
                    }
                }
            });
        }

我能够成功更改第一行，但后续行不能。 我试过$(this).find(select:eq(0)).html()代替document.getElementById()但没有运气。 我觉得我很接近但缺乏 jquery/javascript 的专业知识。 谢谢你的帮助。

Answer 1

您正在为错误的每个表行重新分配 onreadystatechange 函数，

首先为它必须做的事情分配函数，然后发送请求，然后等待响应准备好，然后寻找你想要的元素并用响应文本替换元素 html，如下所示，

function getJobs(taskID){

    var xhttp = new XMLHttpRequest();
    var url = "dynamicdd.php";
    var data = new FormData();
        data.append('taskID', taskID);
    xhttp.open('POST', url, true);
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            $('#cTable tr').each(function(index, element){
                $(element).find('#testSelect').html(xhttp.responseText);     
            }
        }
    });
    xhttp.send(data);
}