Django與AJAX實(shí)現(xiàn)網(wǎng)頁動態(tài)數(shù)據(jù)顯示的示例代碼
前言
這部分已經(jīng)折騰我兩天了,還是沒有頭緒,可能還會折騰更久,最后在第三天上午解決問題,在一個不起眼的地方被坑了,jQuery加載的問題。會者不難,難者不會,希望后面人少走彎路吧
環(huán)境
- windows10
- pycharm2017.3.3 professional edition
- python3.6.4
- django2.0.2
方法
創(chuàng)建后臺讀取數(shù)據(jù)函數(shù),用于后臺從數(shù)據(jù)庫讀取數(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ù)據(jù)
- temp1是第一行數(shù)據(jù)里的temp1數(shù)據(jù)
如果沒有數(shù)據(jù)庫數(shù)據(jù)的話,直接寫成固定的數(shù)據(jù)用來測試也是可以的
加載函數(shù),讓HTML頁面能夠訪問到函數(shù)。在urls.py添加一下代碼
urlpatterns = [ path('data_fresh/', views.data_fresh, name="data_fresh"), ]
前端使用jQuery訪問后臺函數(shù),要實(shí)現(xiàn)數(shù)據(jù)動態(tài)顯示,還需要增加定時程序,在HTML頁面插入以下代碼
<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)頁動態(tài)數(shù)據(jù)顯示的示例代碼的文章就介紹到這了,更多相關(guān)Django AJAX 動態(tài)數(shù)據(jù)顯示內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Python實(shí)現(xiàn)圖的廣度和深度優(yōu)先路徑搜索算法
圖是一種抽象數(shù)據(jù)結(jié)構(gòu),本質(zhì)和樹結(jié)構(gòu)是一樣的。圖與樹相比較,圖具有封閉性,可以把樹結(jié)構(gòu)看成是圖結(jié)構(gòu)的前生。本文將利用Python實(shí)現(xiàn)圖的廣度和深度優(yōu)先路徑搜索算法,感興趣的可以學(xué)習(xí)一下2022-04-04Python數(shù)據(jù)類型轉(zhuǎn)換匯總
這篇文章主要給大家分享的是Python數(shù)據(jù)類型轉(zhuǎn)換匯總,int,float相互轉(zhuǎn)換、int,string相互轉(zhuǎn)換、float,string相互轉(zhuǎn)換、string,list相互轉(zhuǎn)換等常見內(nèi)容,需要的小伙伴可以參考一下2022-03-03PyTorch實(shí)現(xiàn)圖像識別實(shí)戰(zhàn)指南
圖像識別是從給定圖像中提取有意義的信息(例如圖像內(nèi)容)的過程,下面這篇文章主要給大家介紹了關(guān)于PyTorch實(shí)現(xiàn)圖像識別的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-02-02淺談Python3中strip()、lstrip()、rstrip()用法詳解
這篇文章主要介紹了淺談Python3中strip()、lstrip()、rstrip()用法詳解,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2019-04-04Python實(shí)現(xiàn)隨機(jī)漫步的詳細(xì)過程
隨機(jī)漫步顧名思義每一步都是隨機(jī)的,假設(shè)有一個點(diǎn),下一步往哪里走,走多遠(yuǎn),這些都沒有明確的表示,完全是隨機(jī)的,最后走到哪里,是由一系列隨機(jī)決策決定的,這篇文章主要給大家介紹了關(guān)于Python實(shí)現(xiàn)隨機(jī)漫步的相關(guān)資料,需要的朋友可以參考下2023-03-03python基于OpenCV模板匹配識別圖片中的數(shù)字
這篇文章主要介紹了python基于OpenCV模板匹配識別圖片中的數(shù)字,幫助大家更好的理解和學(xué)習(xí)使用python,感興趣的朋友可以了解下2021-03-03