Question

这是我的第一个网站项目，但我决定问这个，因为我不知道如何开始，尽管看了无数的教程。

我有这样的ul列表项

<li><a href="posts.html?id=1">Data for id 1</a></li>
<li><a href="posts.html?id=2">Data for id 2</a></li>

像这样的json.file

{
 "posts": [{
  "id": 1,
  "postId": 1,
  "img":"",
  "title": ""
}]
}

我希望这个json充满了大量的对象，我希望通过postId

获得这个

我不知道如何id.Everything我找到的是Angular / React，我还在学习基本的JS / Ajax

所以，如果我点击li并使用？id = 1 ...来获取所有带有“postId”的json数据

Answer 1

这个问题非常广泛，但也许这会帮助你开始。

如果稍微更改HTML结构会更容易：

<li><a href="" data-id="1">Data for id 1</a></li>
<li><a href="" data-id="2">Data for id 2</a></li>

然后你可以添加一些JS来添加一个点击处理程序。我将在这里使用jQuery，但你可以用纯JS，React，Angular或任何你想要的东西轻松地做到这一点。

$('a').on('click', function(ev) {
    ev.preventDefault();
    $.get('/posts.php', {id: $(this).data('id')}).then(res => {
         console.log(res);
    });
});

基本上，我们向页面上的所有<a>添加了一个点击处理程序（您应该使用更具体的类），然后触发an ajax request，传递https://openlayers.org/en/latest/examples/draw-and-modify-features.html 1}}我们从id读出来。

现在在服务器上，您将不得不编写一个脚本来解析您的JSON文件并返回您感兴趣的数据。我会给您一些PHP来帮助您入门，但是您可以做这与Node.js或任何其他服务器端语言：

data-id

然后你必须在获取数据之后决定你真正想要对这些数据做些什么。在这里，我刚刚将其记录到Chrome / Firefox DevTool的控制台，但您可能希望以某种方式将其显示给用户。

如何从json中获取基于点击了哪些数据的数据？

1 个答案: