如何在行后插入消息？

Question

我有这个代码样本位，我想知道我可以去有关编号所有这些行，所以当我点击Read按钮，这样一来，它打开直接与它相关联的行下方的对话框，并显示该消息。我真的不知道如何识别行并在正确的行之后显示消息。

var email; 
$.getJSON("list.js", function(data) { 
    console.log(data); 
    email = data; 
    // data is a JavaScript object now. Handle it as such 

    var table = document.getElementById("start"); 

    for(var i = 0; i<email.length; i++) 
    { 
     var row = table.insertRow(1); 
     var cell1 = row.insertCell(0); 
     var cell2 = row.insertCell(1); 
     var cell3 = row.insertCell(2); 
     var cell4 = row.insertCell(3); 
     cell1.innerHTML = '<button id="' + email[i].ID + '">Read</button>'; 
     cell2.innerHTML = email[i].ID; 
     cell3.innerHTML = email[i].Time; 
     cell4.innerHTML = email[i].Subject; 
    } 

}); 

这是我到目前为止，我被告知，我可以通过我分配给它的ID调用按钮，调用父的家长和后插入行，但我可以” t似乎是正确的。有什么建议么？

那么，在大多数情况下，我把你的建议，我能得到它的工作好一点，但我有一个问题。

var email; 
$.getJSON("list.js", function(data) { 
console.log(data); 
email = data; 
// data is a JavaScript object now. Handle it as such 

var table = document.getElementById("start"); 

for(var i = 0; i<email.length; i++) 
{ 
var row = table.insertRow(i + 1); 
var cell1 = row.insertCell(0); 
var cell2 = row.insertCell(1); 
var cell3 = row.insertCell(2); 
var cell4 = row.insertCell(3); 
cell1.innerHTML = '<button id="' + email[i].ID + '" onclick="getmessage(this.id)">Read</button>'; 
cell2.innerHTML = email[i].ID; 
cell3.innerHTML = email[i].Time; 
cell4.innerHTML = email[i].Subject; 
} 
}); 

var x; 
function getmessage(x) 
{ 
var a = $("#" + x).parent().parent(); 
//debugger; 
$.getJSON(x + ".js", function(data) { 
debugger; 
a.after('<tr><td colSpan = 4>' + x + ".js" + '</td></tr>'); 
}) 
}; 


/*var x; 
function getmessage(x) 
{ 
var a = $("#" + x).parent().parent(); 
a.after('<tr><td colSpan = 4>' + x + ".js" + '</td></tr>'); 
} 
*/ 

这是我迄今为止，但由于某种原因，当我张贴此代码，并对其进行测试，只有我的列表的最后一个元素之后出现。我脱下.getJSON一部分，它们都使该行的消息后，这里按下按钮，但是当我有它，我注意到，所有的文件都得到正确调用，但只有最后一排的职位信息。代码有什么问题？

更新：我只是意识到，这是不接受用大写字母的文件。这是为什么？

Answer 1

var email; 
$.getJSON("list.js", function(data) { 
    console.log(data); 
    email = data; 
    // data is a JavaScript object now. Handle it as such 

    var table = document.getElementById("start"); 

    for(var i = 0; i<email.length; i++) 
    { 
     var row = table.insertRow(1); 
     var cell1 = row.insertCell(0); 
     var cell2 = row.insertCell(1); 
     var cell3 = row.insertCell(2); 
     var cell4 = row.insertCell(3); 

     cell1.innerHTML = '<button class="readbutton" data-email="' + email[i].ID + '">Read</button>'; 
     cell2.innerHTML = email[i].ID; 
     cell3.innerHTML = email[i].Time; 
     cell4.innerHTML = email[i].Subject; 
     var row2 = table.insertRow(1); 
     var cell4 = row.insertCell(0); 
     $(cell4).attr("colspan",3); 
     $(cell4).attr("dispaly","none"); 
     $(cell4).attr("id",email[i].ID+"_msg"); 
     cell4.innerHTML = email[i].message; 
    } 

}); 
and 
some where in your script 
$(".readbutton").click(function(){ 
    $($(this).data("email")+"_msg").toggle(); 
});