I'm using JavaScript to generate an HTML table to populate with data from an AJAX file. I want to dynamically add links in certain cells to myfile.php. I'll let PHP handle the request.
Each cell should have a link, all linked back to my PHP file, similar to:
<a href="myfile.php?data=单元格值">点击这里</a>
But how do I add these links?
Take this simple example, with only two fields. So I want each cell to have a unique link so that I can provide another JSON file for the extended information.
I consider using conditional statements to judge based on keys.
if (index == 'username') {
添加链接
} else {
.....
}
I'm having trouble with the correct syntax and I can't get it to work. In all these years, I've never programmed JavaScript.
Please view the code below:
<HTML>
...
<script>
var data = [
{
"id": "3",
"username": "foo",
"email": "hhh@hhh.com"
},
{
"id": "9",
"username": "foobarbam",
"email": null
},
{
"id": "10",
"username": "bar",
"email": "bar@proton.me"
},
{
"id": "11",
"username": "bam",
"email": null
},
{
"id": "12",
"username": "snoopy",
"email": null
},
{
"id": "15",
"username": "rogerwaters",
"email": "barbam@proton.me"
}
];
var keys = [];
document.write("<table><tr>");
var tr;
for (var i = 0; i < data.length; i++) {
tr = $('<tr/>');
tr.append("<td>" + data[i].username + "</td>");
tr.append("<td>" + data[i].email + "</td>");
$('table').append(tr);
}
document.write("</table>");
</script>
</body> 
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
If every cell should contain a link, then you don't need any conditions. You just need to modify the HTML so that it outputs one link at a time.
Demo:
var data = [{ "id": "3", "username": "foo", "email": "hhh@hhh.com" }, { "id": "9", "username": "foobarbam", "email": null }, { "id": "10", "username": "bar", "email": "bar@proton.me" }, { "id": "11", "username": "bam", "email": null }, { "id": "12", "username": "snoopy", "email": null }, { "id": "15", "username": "rogerwaters", "email": "barbam@proton.me" } ]; document.write("<table><tr>"); var tr; for (var i = 0; i < data.length; i++) { tr = $('<tr/>'); tr.append("<td><a href='myfile.php?data=" + data[i].username + "'>" + data[i].username + "</a></td>"); tr.append("<td><a href='myfile.php?data=" + data[i].email + "'>" + data[i].email + "</a></td>"); $('table').append(tr); } document.write("</table>");