Tambahkan pautan dinamik ke jadual HTML AJAX yang dijana oleh JavaScript
P粉311464935
P粉311464935 2023-09-15 11:20:12
0
1
493

Saya menggunakan JavaScript untuk menjana jadual HTML untuk diisi dengan data daripada fail AJAX. Saya mahu menambah pautan secara dinamik dalam sel tertentu ke myfile.php. Saya akan membiarkan PHP mengendalikan permintaan itu.

Setiap sel harus mempunyai pautan, semuanya memaut kembali ke fail PHP saya, seperti:

<a href="myfile.php?data=单元格值">点击这里</a>

Tetapi bagaimana saya boleh menambah pautan ini?

Ambil contoh mudah ini dengan hanya dua medan. Jadi saya mahu setiap sel mempunyai pautan unik supaya saya boleh menyediakan fail JSON yang lain untuk maklumat lanjutan.

Saya mempertimbangkan untuk menggunakan pernyataan bersyarat untuk menilai berdasarkan kunci.

if (index == 'username') {
    添加链接
} else {
    .....
}

Saya menghadapi masalah dengan sintaks yang betul dan saya tidak dapat menjalankannya. Sepanjang tahun ini, saya tidak pernah memprogramkan JavaScript.

Sila lihat kod di bawah:

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

P粉311464935
P粉311464935

membalas semua(1)
P粉729436537

Jika setiap sel harus mengandungi pautan, anda tidak memerlukan sebarang syarat. Anda hanya perlu mengubah suai HTML supaya ia mengeluarkan satu pautan pada satu masa.

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>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!