gpt4 book ai didi

javascript - Ajax 最佳实践

转载 作者:行者123 更新时间:2023-12-02 20:29:13 25 4
gpt4 key购买 nike

假设我有以下 HTML 页面。

<A panel to display list of items>
Item A
Item B
Item C
...

<A panel to display details about item>
Details on item X:

我想编写该页面,以便每当用户单击其中一项时,有关所选项目的详细信息就会显示在底部面板上。

但是,我想解决的几个问题是:

  • 我应该如何防止重复请求。 (例如,在项目 A 的详细信息从服务器返回之前,用户按下了项目 A 和 B 的链接)。
  • 如果我想显示“详细信息正在加载...”,我应该将代码放在哪里?

最佳答案

您可以注册点击处理程序,它会触发 ajax 请求来加载数据。

有多种方法可以解决您对不触发多个请求的担忧:

  1. 只需在点击其中一个项目时注销其他项目上的处理程序,然后在请求返回时将其放回即可。
  2. 您可以在请求处理程序的范围内拥有一个对象,并为其设置属性(例如“requestInProgress”),并适本地将其设置为 true 和 false。换句话说,使用闭包。

显示“详细信息正在加载”很简单——您可以在触发请求之前将Panel dom或innerhtml(如果您愿意)的值设置为该消息,并在请求时设置实际返回的值返回。

请注意,许多 js 库(例如 jQuery)提供了一个 API,用于发出 Ajax 请求,这可能会简化事情。例如,jQuery.ajax 方法采用一个对象文字,其中可以包含函数“beforeSend”、“complete”、“success”,因此您可以在成功之前、之后和成功时执行操作(在其他函数中,请查看 http://api.jquery.com/jQuery.ajax/ )

你当然可以使用裸机 js 做你想做的事情,但是库可以让你的生活更轻松。

关于javascript - Ajax 最佳实践,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4434570/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com