Question

我正在创建一个编辑按钮，用于编辑我的行中的数据。问题是如果我点击多个编辑按钮它不符合。它仅在我单击1编辑按钮时符合。

HERES MY CODE

function editRow(t)
{
        var i = t.parentNode.parentNode.rowIndex;
        var table = document.getElementById('myTable');

        if (  table.rows[i].cells[3].childNodes[0].value =="Edit")
        {
            var name = table.rows[i].cells[0].innerHTML;
            var age = table.rows[i].cells[1].innerHTML;
            var gender = table.rows[i].cells[2].innerHTML;
            var tname = table.rows[i].cells[0];
            var tage = table.rows[i].cells[1];
            var tgender = table.rows[i].cells[2];

            tname.innerHTML = "";
            var textname = document.createElement("input");
            textname.id = "textname";
            tname.appendChild(textname);

            tage.innerHTML = "";
            var textage = document.createElement("input");
            textage.id = "textage";
            tage.appendChild(textage);
            tgender.innerHTML = "";
            var textgender = document.createElement("select");
            textgender.id = "textgender";
            tgender.appendChild(textgender);

            document.getElementById('textname').focus();
            document.getElementById("uid").innerHTML = i;
            document.getElementById("textname").value = name;
            document.getElementById("textage").value = age;
             textgender.options.add(Option(gender));

            if(gender == "Male")    textgender.options.add(new Option("Female"));
            else                    textgender.options.add(new Option("Male"));


            table.rows[i].cells[3].childNodes[0].value="Save"
            document.getElementById("name").disabled = true;
            document.getElementById("age").disabled = true;
            document.getElementById("gender").disabled = true;
            document.getElementById("insert").disabled = true;
        }
        else
        {
            update(document.getElementById('uid').innerHTML);
            table.rows[i].cells[3].childNodes[0].value="Edit"
            document.getElementById("insert").disabled = false;

        }
    }

谢谢你的帮助......

Answer 1

你应该改变： textgender.options.add(Option(gender)); 至 textgender.options.add(new Option(gender));

但更重要的是编辑按钮：

您尝试通过id访问表格上的可编辑输入 - 但是当您创建第二组textname和textage输入时，id与您正在编辑的另一行相同。您需要在这些元素上创建唯一的ID（可能是通过将行号附加到id），或者您需要对其进行设置，以便您一次只能编辑一行（当您'时，禁用并灰显其他行）重新编辑一个）

Answer 2

请在使用jsfiddle时，请在javascript标签上保留javascript，在html标签上保留html，以便更轻松，更快捷地为您提供帮助。

我相信您应该在代码上调整两个位置：

<强>第一

document.getElementById('textname').focus();
document.getElementById("uid").innerHTML = i;
document.getElementById("textname").value = name;
document.getElementById("textage").value = age;
textgender.options.add(Option(gender));

应该是

document.getElementById('textname').focus();
document.getElementById("uid").innerHTML = i;
document.getElementById("textname").value = name;
document.getElementById("textage").value = age;
textgender.options.add(new Option(gender));

<强>第二

        else
        {
            update(document.getElementById('uid').innerHTML);
            table.rows[i].cells[3].childNodes[0].value="Edit"
            document.getElementById("insert").disabled = false;

        }

应该是：

        else
        {
            update(document.getElementById('uid').innerHTML);
            table.rows[i].cells[3].childNodes[0].value="Edit"
            document.getElementById("name").disabled = false;
            document.getElementById("age").disabled = false;
            document.getElementById("gender").disabled = false;                
            document.getElementById("insert").disabled = false;

        }

在这里试试http://jsfiddle.net/te2wF/31/

不使用Javascript中的编辑按钮

2 个答案: