选中的设置属性复选框不起作用

Question

我正在生成一个动态表，向其添加一行，然后将一些属性分配给这些单元格中添加的元素。除了复选框设置或重置外，一切正常。在函数 display_start_time() 中，命令

document.getElementById(domain).checked = false; 

不适用于动态生成的行。当我向此函数抛出静态表时，它可以正常工作。问题可能出在setAttribute函数（使用IE10，Windows 8）上，因为我尝试在线浏览了许多解决方案，但无法在这方面取得突破。提供的解决方案之一是切换到jquery，但这对我来说几乎没有问题。

1. 我不知道 jquery
2. 这将花费我大量的时间来学习，然后根据jquery更改我的整个代码。

函数Report在单击按钮以创建新行时调用。 display_time(domain,range);工作正常。

请指导我。脚本从这里开始

function display_start_time(domain, range, user_id, process_id, process_name)
{    
    if(!document.getElementById(user_id).innerHTML)
    {       
        alert("Please select the server");
        document.getElementById(domain).checked = false;
    }
    else
    {
        question= confirm("Have you STARTED the " + domain + " of " + process_id + " ? ");  
        {
            if(question)
                display_time(domain,range);
            else
            {
                document.getElementById(domain).checked = false;
            }
        }
    }
}
function report(set_id,btn_id)
{ 
    question= confirm("Has the error occurred ?");  
    if(question)
    {
        new_table = document.getElementById("isolop_table");
        row = new_table.insertRow();
        cell_1 = row.insertCell(0);
        cell_2 = row.insertCell(1);
        cell_3 = row.insertCell(2);
        cell_4 = row.insertCell(3);
        cell_5 = row.insertCell(4);
        cell_6 = row.insertCell(5);
        cell_7 = row.insertCell(6);
        cell_8 = row.insertCell(7);
        cell_9 = row.insertCell(8);
        //  Inserting Data in Isolop Table Rows
        cell_1.innerHTML = serial;
        cell_2.innerHTML = document.getElementById(set_id).innerHTML;
        cell_2.setAttribute("id", "Int" + serial);
        cell_4.innerHTML = cell_5.id;
        cell_4.setAttribute("id","user_id"+serial);
        cell_7.innerHTML = "Start Time";
        cell_7.setAttribute("id","disp_start"+serial);
        cell_8.innerHTML = "End Time";
        cell_8.setAttribute("id","disp_end"+serial);
        cell_5.innerHTML = "<input type='checkbox' ></input>";
        cell_5.setAttribute("id", "INT"+serial);
        //          cell_5.setAttribute("checked", 'true');
        cell_5.setAttribute('onclick',"display_start_time(cell_5.id,cell_7.id,cell_4.id,cell_2.innerHTML,'ISOLOP')");
        cell_4.innerHTML = cell_5.id;
        cell_6.innerHTML = "<input type='checkbox'></input>";
        cell_6.setAttribute("id", "end"+serial);
        cell_6.setAttribute('onclick',"display_end_time(cell_6.id,cell_8.id,cell_5.id,cell_2.innerHTML,'ISOLOP');");
        cell_9.innerHTML = " <button type='button' onclick=report('Int1');>Report Error</button>";
        document.getElementById(btn_id).disabled = true;
        document.getElementById(btn_id).onclick = false;
        return serial++;
    }
}

Answer 1

我认为问题来自这一行：

cell_5.setAttribute('onclick',"display_start_time(cell_5.id,cell_7.id,cell_4.id,cell_2.innerHTML,'ISOLOP')");

将 onclick 处理程序设置为字符串时，它将在页面的全局上下文中执行，而不是在设置处理程序的上下文中执行。如果全局上下文中不存在cell_5、cell_7等，则该函数将失败。

尝试使用 addEventListener 或将匿名函数作为事件处理程序的 onclick 设置。cell_# 变量将在其作用域内捕获，因此它的功能应符合您的预期。

cell_5.addEventListener('click', function() {
    display_start_time(cell_5.id, cell_7.id, cell_4.id, cell_2.innerHTML, 'ISOLOP');
}, false);

或

cell_5.onclick = function() {
    display_start_time(cell_5.id, cell_7.id, cell_4.id, cell_2.innerHTML, 'ISOLOP');
}

同样，您应该为 cell_6 上的单击处理程序执行此操作。