json 动态添加链接到JavaScript生成的 AJAX HTML表

hfwmuf9z  于 2023-08-08  发布在  Java
关注(0)|答案(1)|浏览(118)

我用JavaScript生成HTML表格,用 AJAX 文件中的数据填充单元格。我想动态添加链接到某些单元格。链接到myfile.php。我将让PHP处理请求。
每个细胞都应该有一个链接。都链接回我的php文件,类似于

<a href="myfile.php?data=whatever_the _cell_value_is">Click here</a>

字符串
如何添加链接?
举个简单的例子。只有两个领域。因此,我希望每个单元格都有一个唯一的链接回到我的服务器,这样我就可以为扩展信息提供另一个JSON文件。
我在想一个条件句,取决于关键词。

if(index == 'username') {

    ADD THE LINK
 } else { 
    .....
 }


我在正确的语法上遇到了麻烦,我在让它工作上遇到了麻烦。这些年来,我从来没有写过JavaScript。
请参阅下面的代码。

<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>

lawou6xi

lawou6xi1#

如果每个单元格都应该包含一个链接,那么你就不需要任何条件。您可以修改HTML,以便每次输出一个链接。
演示:

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>");

个字符

相关问题