前言
這部分已經(jīng)折騰我兩天了,還是沒(méi)有頭緒,可能還會(huì)折騰更久,最后在第三天上午解決問(wèn)題,在一個(gè)不起眼的地方被坑了,jQuery加載的問(wèn)題。會(huì)者不難,難者不會(huì),希望后面人少走彎路吧
環(huán)境
- windows10
- pycharm2017.3.3 professional edition
- python3.6.4
- django2.0.2
方法
創(chuàng)建后臺(tái)讀取數(shù)據(jù)函數(shù),用于后臺(tái)從數(shù)據(jù)庫(kù)讀取數(shù)據(jù)。在views.py文件內(nèi)增加以下代碼
from django.http import JsonResponse
def data_fresh(request):
context = {"data1": Test.objects.order_by("-time")[0].temp1,
"data2": Test.objects.order_by("-time")[0].temp2}
return JsonResponse(context)
- data_fresh是函數(shù)名
- Test是Django項(xiàng)目下的模型
- order_by(“-time”)[0]指按時(shí)間列倒序排列并取第一行數(shù)據(jù)
- temp1是第一行數(shù)據(jù)里的temp1數(shù)據(jù)
如果沒(méi)有數(shù)據(jù)庫(kù)數(shù)據(jù)的話,直接寫成固定的數(shù)據(jù)用來(lái)測(cè)試也是可以的
加載函數(shù),讓HTML頁(yè)面能夠訪問(wèn)到函數(shù)。在urls.py添加一下代碼
urlpatterns = [
path('data_fresh/', views.data_fresh, name="data_fresh"),
]
前端使用jQuery訪問(wèn)后臺(tái)函數(shù),要實(shí)現(xiàn)數(shù)據(jù)動(dòng)態(tài)顯示,還需要增加定時(shí)程序,在HTML頁(yè)面插入以下代碼
script>
$(document).ready(function(){
function refresh(){
$.getJSON("/data_fresh/", function (ret) {
$('#result').html(ret.data1);
$('#result2').html(ret.data2);
})
}
setInterval(refresh, 3000)
})
/script>
上面的程序?qū)⒌?步里的temp1和temp2寫入id為result1和result2的標(biāo)簽里
到此這篇關(guān)于Django與AJAX實(shí)現(xiàn)網(wǎng)頁(yè)動(dòng)態(tài)數(shù)據(jù)顯示的示例代碼的文章就介紹到這了,更多相關(guān)Django AJAX 動(dòng)態(tài)數(shù)據(jù)顯示內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
您可能感興趣的文章:- 在Django中創(chuàng)建動(dòng)態(tài)視圖的教程
- Django結(jié)合ajax進(jìn)行頁(yè)面實(shí)時(shí)更新的例子
- Django+Ajax+jQuery實(shí)現(xiàn)網(wǎng)頁(yè)動(dòng)態(tài)更新的實(shí)例
- Django動(dòng)態(tài)隨機(jī)生成溫度前端實(shí)時(shí)動(dòng)態(tài)展示源碼示例