使用 Ajax 调用刷新 JSP 页面上的 div 而没有响应

Posted

技术标签:

【中文标题】使用 Ajax 调用刷新 JSP 页面上的 div 而没有响应【英文标题】:Refresh div on JSP page with Ajax call without a response 【发布时间】:2021-03-09 12:25:34 【问题描述】:

我知道使用 AJAX 调用来使用收到的响应刷新 div 内的内容,但在我的情况下,我没有响应但仍想刷新 div。

我的应用程序有一个名为“购物车”的表格,当我单击删除按钮时,它会从购物车中删除一个项目。我通过向 Java servlet 发送 AJAX 调用来删除该项目,该调用更新 ArrayList 中的购物车。由于我只删除了一个对象,因此我没有响应,但仍想使用已删除的项目更新购物车。

我尝试了以下方法:

    更新购物车数组后使用 servlet 重定向到同一页面。这会导致页面重新加载。 request.getRequestDispatcher(target).forward(request, response); 其中目标是 index.jspx

    使用$(..).load('index.jspx') 尝试刷新特定的div,但这会将index.jspx 的全部内容放入带有购物车表的小div 中。

【问题讨论】:

您的 ajax 代码会有所帮助,但我建议您可以在 ajax 成功处理程序中使用 jQuery 删除该行?您无需响应即可访问回调。 @Lapskaus,非常感谢。我似乎从来没有想过这个解决方案,但我已经实现了它并且它可以根据需要运行。 【参考方案1】:

AJAX 请求(异步 javascript 和 XML)被发送到您的服务器。您可以为您的 AJAX 请求定义一个回调,即请求结束后将执行的 Javascript function。您也可以为此目的使用promises。无论如何,一旦您知道如何在请求完成后执行某个功能,您就需要决定是否需要来自服务器的信息。

如果您满足于没有从服务器收到任何有意义的答案并且可以假设删除成功,那么您可以简单地记住按下了哪个删除按钮,找到包含它的行和remove()它。在这种情况下,您不需要向服务器发送更多请求。

否则,如果您需要从服务器获取更多信息(因为可能已经创建/修改/删除了新项目),那么只需更改您的服务器端,以便将有关项目的 JSON 发送回客户端 -侧边刷新你的桌子。

【讨论】:

【参考方案2】:

您实际上不必再次重定向整个内容。无需重定向,只需在 doPost()doGet() 中使用 response.getWriter().write(<Your updated Array>);,具体取决于您使用的是哪个。

这会将更新后的数组发送到 AJAX 代码,而不是刷新整个页面。

【讨论】:

以上是关于使用 Ajax 调用刷新 JSP 页面上的 div 而没有响应的主要内容,如果未能解决你的问题,请参考以下文章

如何使用ajax刷新刷新div?

ajax提交数据以后刷新当前页面,怎么实现

如何利用jQuery局部刷新页面中的div元素

ajax调用删除方法后,页面不手动刷新,就一直显示那信息

ajax加载的内容页面刷新之后,内容怎么保持不变?

ajax操作后如何刷新jsp页面