Django與AJAX實(shí)現(xiàn)網(wǎng)頁動(dòng)態(tài)數(shù)據(jù)顯示的示例代碼
這部分已經(jīng)折騰我兩天了,還是沒有頭緒,可能還會(huì)折騰更久,最后在第三天上午解決問題,在一個(gè)不起眼的地方被坑了,jQuery加載的問題。會(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ù)庫讀取數(shù)據(jù)。在views.py文件內(nèi)增加以下代碼
from django.http import JsonResponsedef 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ù)
如果沒有數(shù)據(jù)庫數(shù)據(jù)的話,直接寫成固定的數(shù)據(jù)用來測試也是可以的
加載函數(shù),讓HTML頁面能夠訪問到函數(shù)。在urls.py添加一下代碼
urlpatterns = [ path(’data_fresh/’, views.data_fresh, name='data_fresh'),]
前端使用jQuery訪問后臺(tái)函數(shù),要實(shí)現(xiàn)數(shù)據(jù)動(dòng)態(tài)顯示,還需要增加定時(shí)程序,在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)頁動(dòng)態(tài)數(shù)據(jù)顯示的示例代碼的文章就介紹到這了,更多相關(guān)Django AJAX 動(dòng)態(tài)數(shù)據(jù)顯示內(nèi)容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)!
相關(guān)文章:
1. ajax請求后臺(tái)得到j(luò)son數(shù)據(jù)后動(dòng)態(tài)生成樹形下拉框的方法2. phpstudy apache開啟ssi使用詳解3. JSP之表單提交get和post的區(qū)別詳解及實(shí)例4. Xml簡介_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理5. 詳解瀏覽器的緩存機(jī)制6. .Net Core和RabbitMQ限制循環(huán)消費(fèi)的方法7. jsp實(shí)現(xiàn)登錄驗(yàn)證的過濾器8. jsp文件下載功能實(shí)現(xiàn)代碼9. ASP動(dòng)態(tài)網(wǎng)頁制作技術(shù)經(jīng)驗(yàn)分享10. 存儲(chǔ)于xml中需要的HTML轉(zhuǎn)義代碼
