如何使用 JS 将选定数据从一行表传递到另一个页面答案

【问题标题】：How to Pass Selected Data from a Row of Table to Another Page Using JS如何使用 JS 将选定数据从一行表传递到另一个页面
【发布时间】：2018-04-01 14:20:52
【问题描述】：

我有一个包含信息的表，现在我想将选定行的信息传递到另一个页面。为了创建指向另一个页面的链接，我已将图像作为链接，现在我想将该行的信息传递给另一个，以便我可以显示所选图像及其信息。请帮助。 My table。假设我点击了第一张图片，所以我想将该特定的信息传递到另一页。

HTML 和 JS

<table style="width:100%" id="ex-table">
        <th>Image</th>
        <th>Name</th>
        <th>Price</th>
        <th>Category</th>
        <th>Description</th>
    <script>
    var fbRef = firebase.database().ref().child("Sell_Products");
fbRef.on("child_added", snap => {
    var name = snap.child("name").val();
    var price = snap.child("price").val();
    var category = snap.child("category").val();
    var description = snap.child("description").val();
    var image = snap.child("image").val();
    $("#ex-table").append("<tr><td><a href='auction.html'><img src=" + image + "/img></a></td><td>" + name + "</td><td>" + price + "</td><td>" + category + "</td><td>" + description + "</td></tr>" );
});
</script>
</table>

提前致谢

【问题讨论】：

标签： javascript css firebase firebase-realtime-database

【解决方案1】：

您应该获取孩子的密钥，并将其作为 QueryString 参数传递到您在单击图像时调用的 URL 中。

fbRef.on("child_added", snap => {
   var key = snap.key;
   var name = snap.child("name").val();
   var price = snap.child("price").val();
   var category = snap.child("category").val();
   var description = snap.child("description").val();
   var image = snap.child("image").val();
   $("#ex-table").append("<tr><td><a href=\"auction.html?itemKey=" + key + "\"><img src=" + image + "/img></a></td><td>" + name + "</td><td>" + price + "</td><td>" + category + "</td><td>" + description + "</td></tr>" );
});

然后，在auction.html 页面中获取孩子的密钥并从数据库中查询信息。

如果您想避免在 auction.html 页面上执行新查询，您还可以使用查询字符串中的所有值构建一个 url

【讨论】：

感谢您的回复。这对我来说已经成功了，我可以看到 item 键以及 auction.html url 但由于我是网络开发新手，我不知道如何从中检索数据键，以便与该键对应的所有信息都显示在auction.html 页面中。如果我能得到你的回复，我会很高兴。谢谢
@AbhishekKumar 见stackoverflow.com/questions/901115/…。不要忘记：在这种情况下，“Google 是你的朋友”:-) google.com/…
更新：- 我已经使用了 location.search.split('itemKey=')[1];获取 itemKey 的值。现在我怎样才能从 itemKey 的值中获取 auction.html 中该行中存在的所有值？
@AbhishekKumar 我最好使用第一个答案的方法，即 function getParameterByName(name, url) {... 然后你可以使用 getParameterByName('itemKey');在 JavaScript 中做任何你需要的事情（填充一个字段、一个 div 等......）
@AbhishekKumar 您必须使用 itemKey 查询 Firebase 数据库，例如 return firebase.database().ref('/Sell_Products/' + itemKey).once('value').then(function (snapshot) { var name = snapshot.child("name").val(); // ... });