当对象中的数据发生更改而无需重新加载页面时,将自动更新页面

问题描述 投票:0回答:2

我将数据插入从后端收集的各种div中。此数据得到更新,我需要的是div也自动更新div中的数据,而无需实际刷新整个页面。现在,页面刷新将更新div,但我希望div自动更新而不影响用户体验。有什么建议么。例如,我在前端有一个向上/向下投票按钮,该投票被发送到后端,然后再发送回前端并插入到div中,但是除非刷新刷新,否则他们不会看到自己的投票已注册。页面,所以我需要每次在前端更新用户的投票结果,然后自动进行投票或更改投票等。这只是一个示例,此表中插入了更多数据,可以随时更新。

更新,不确定人们是否完全理解我的需要或尝试做的事情。基本上,对象从后端通过,在页面加载时,来自该对象的数据被插入到表中,例如新帖子,投票等。

我需要做的是检查自页面加载以来对象是否已更改,如果更改,然后在不刷新页面的情况下更新页面上的数据。

理想情况下,这需要立即发生,因此,只要对象数据与浏览器中显示的对象数据之间存在差异,它就会立即识别并进行更新。

希望让我更清楚地知道要做什么。

我拥有并反对带有诸如建议标题,描述,投票状态等信息,这些信息将在新的时候插入到一行中。当带有主对象的新对象通过时,将添加新行。因此,我需要能够检查主对象中的更改,以便随后可以将新对象作为行添加到表中,并且还可以使用已插入的当前对象来检测和更新任何更改。

javascript ajax page-refresh
2个回答
0
投票

如果我理解正确,您所需要的只是一种与后端交互而不刷新页面的方式,对吗?如果是这样,您应该研究AJAX。这是用于投票系统示例的简单方法(需要jQuery):

$.post(url_to_interact_with,{key: 1232,vote:1}, function(data){
   console.log(data);
}

在这种情况下,您发送了一个发布请求,键为1232,投票为1。函数(数据)中的变量是请求的输出。

但是,如果您觉得这不是一件简单的事情,我建议您研究一下websocket。概括一下它们是什么:后端与前端之间的来回交互。后端可以随时发送信息,而无需刷新页面。如果websocket太令人困惑,请使用以下命令:https://pusher.com/

但是老实说,除非绝对必要,否则您不应该尝试采用实时了解div的所有信息的方法。祝好运! :)


0
投票

我了解的是,每当投票更新时,您都需要更新div吗?如果我理解正确,那么一旦您从“投票”材料调用中获得响应,我就想委托代理并向服务器调用一个函数。

如果您想从服务器端获取事件,那么我建议您使用SignalR进行实时通信,这将为您提供一个称为服务器端的事件。

© www.soinside.com 2019 - 2024. All rights reserved.