Question

我的aspx.cs代码：

String

JavaScript函数代码：

string studentid = dr["StudentId"].ToString();
        string studentname = dr["studentName"].ToString();
        Response.Write("<tr id = 'studentid' onclick = 'passValuesToInput(this)' >");
        Response.Write("<td id = 'sid' >");
        Response.Write(studentid);
        Response.Write("</td>");
        Response.Write("<td>");
        Response.Write(studentname);
        Response.Write("</td>");
        Response.Write("<td>");
        Response.Write("<img src = 'Edit-icon.png' height='20' width='20' >");
        Response.Write("</td>");
        Response.Write("<td>");
        Response.Write("<img src = 'ic_delete_48px-128.png' height='20' width='20'>");
        Response.Write("</td>");
        Response.Write("</tr>");
    }

无论我点击哪一行，它都只将第一行第一个元素传递给id = tbId的文本框。帮我提出建议。我想在编辑或删除图像时点击行的第一个单元格到文本框。

Answer 1

document.getElementById（“sid”）将始终返回第一个单元格的innerHTML，因为 id 对于每个元素应该是唯一的，因此getElementById将选择具有该id的第一个元素。如果您的 sid 始终是第一个单元格，那么您可以尝试以下代码：

function passValuesToInput(x){
alert(x.innerHTML);
document.getElementById("tbId").value = x.cells[0].innerHTML;
document.getElementById("tbId").readOnly = true;
}

Answer 2

您应该尝试为该行传递唯一ID，否则它将始终选择第一个。你可以尝试这样的事情：

string studentid = dr["StudentId"].ToString();
    string studentname = dr["studentName"].ToString();
    Response.Write(String.Format("<tr id = '{0}' onclick = 'passValuesToInput({0})' >",studentid ));
    Response.Write("<td id = 'sid' >");
    Response.Write(studentid);
    Response.Write("</td>");
    Response.Write("<td>");
    Response.Write(studentname);
    Response.Write("</td>");
    Response.Write("<td>");
    Response.Write("<img src = 'Edit-icon.png' height='20' width='20' >");
    Response.Write("</td>");
    Response.Write("<td>");
    Response.Write("<img src = 'ic_delete_48px-128.png' height='20' width='20'>");
    Response.Write("</td>");
    Response.Write("</tr>");
}

然后javascript可以写成：

function passValuesToInput(x){
 var elm = {};
 var elms = document.getElementById(x).getElementsByTagName("*");
 for (var i = 0; i < elms.length; i++) {
    if (elms[i].id === 'sid') {
        elm = elms[i];
        break;
    }
 }
 document.getElementById("tbId").value = elm.value; //or use elm.innerHtml
 document.getElementById("tbId").readOnly = true;    
}

如何在javascript中动态获取html表数据值

2 个答案: