玉模板自动刷新Div（Node.js / Express） [英] Auto-Refresh Div in Jade Template (Node.js/Express)

问题描述

我正在使用Node.js，Express，Jade和Redis来开发一个应用程序，该应用程序将显示由reversebeacon.net提供的telnet流中的斑点，这些流程与业余无线电俱乐部成员的Redis数据库交叉引用，如果比赛显示在我的应用程序的表格上。所有这一切到目前为止工作奇妙。

I am using Node.js, Express, Jade, and Redis to develop an app that will display spots from a telnet stream provided by reversebeacon.net, which are cross-referenced against Redis databases of amateur radio club members and if they match are displayed on a table on my app. All this is working wonderfully so far.

不幸的是，我必须刷新整个页面才能在桌面上显示新的点。我只想刷新包含表（#activeDiv）的div，而不是设置一个刷新整个页面的间隔。

Unfortunately, I have to refresh the entire page to show new spots on the table. I would like to only refresh the div that contains the table (#activeDiv), instead of setting an interval that will refresh the entire page.

我遇到的大多数示例在网络上已经面向PHP，我已经尝试适应这些应用程序，但迄今尚未成功。

Most examples I've encountered on the web have been geared towards PHP, I've attempted to adapt these for my application, but have not been very successful thus far.

layout.jade

doctype 5
html
  head
    title HAMjitsu | Club Spotter (Flying Pigs, FISTS, SKCC, NAQCC)
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(src='http://code.jquery.com/jquery-latest.js')
    script
      // nothing I've placed here has worked :-(
  body
    h1 HAMjitsu
    p Welcome to HAMjitsu, the realtime tool that let's you see who's on the air right now!
    p This application is in the early "alpha" phase of development.  For now, the Flying Pigs will be able to see when their fellow piggies are causing havoc on the bands.  But don't you worry, other clubs will soon be able to use this tool.  
    block content

index.jade

extends layout

block content
  div#activediv
    table
      thead
        tr
          th DE
          th Freq
          th DX
          th NR
          th Mode
          th dB
          th WPM
          th CQ
          th UTC  
      tbody
        each spot, i in spots
          tr
            td: !{spot.de}
            td: !{spot.freq}
            td: !{spot.dx}
            td: !{spot.nr}
            td: !{spot.cw}
            td: !{spot.snr}
            td: !{spot.wpm}
            td: !{spot.cq}
            td: !{spot.utc}

推荐答案

可以使用jquery和ajax使用 load（）函数。

This can be done with jquery and ajax using the load() function.

<div id="myid"/>

$("#myid").load("a/path")

The data returned by a/path will be stored inside the div. To fetch the data you poll the server every second or use websockets and push the data directly from the server to the client.

这篇关于玉模板自动刷新Div（Node.js / Express）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！