django學(xué)習(xí)之a(chǎn)jax post傳參的2種格式實(shí)例
1、ajax的含義
Ajax全稱“Async Javascript And XML”即：異步的javascript和XML。它是一種稱謂，并不指代某項(xiàng)具體的技術(shù)，準(zhǔn)確來說是一系列技術(shù)的集合.現(xiàn)在，所有的無刷新操作都被稱為“Ajax”.
2、使用ajax的好處:
使用ajax避免了整頁數(shù)據(jù)的刷新，也減少了請求等待的時(shí)間，提高了用戶體驗(yàn).
二.ajax傳參的兩種格式假設(shè)有如下表單，需要將這些表單用ajax傳參的方式傳給后臺(tái)，該怎么做呢…
我們知道ajax傳參的格式為$.post(“地址”,參數(shù),function(返回值){})，套用這個(gè)格式進(jìn)行傳參，有以下兩種方法：
方法一：提交表單中的部分字段
我們可以獲取用戶名，密碼等內(nèi)容，將其拼接成一個(gè)字典(想傳什么就將其拼接成字典格式，沒有特殊限制，你甚至可以單獨(dú)的只傳一個(gè)用戶名)，將其作為參數(shù)傳給后臺(tái)
例：
{‘username’:username,‘password’:password,‘csrfmiddlewaretoken’:csrf}
或
{‘username’:username‘}
或
{‘password’:password}
關(guān)于csrf是預(yù)防跨站攻擊的內(nèi)容，你可以移步djanjo之csrf防跨站攻擊作下了解
接下來看看代碼中是如何實(shí)現(xiàn)的，重點(diǎn)關(guān)注帶有下方標(biāo)記的代碼
{# 🌈ajax #}
{# 🌈post提交 #}
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>注冊</title> {# 引用jquery #} <script src='https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js'></script></head><body><form ation='' method='post'> {# 防止跨站攻擊 #} {% csrf_token %} 用戶名：<input type='text' name='username'><br> 密碼：<input type='text' name='password'><br><!-- {# 表單提交 #}--><!-- <input type='submit'>--><!-- {# ajax提交 #}--> <input type='button' value='注冊' id='button'></form></body></html><script>{# 🌈ajax #} $('#button').click(function(){username = $('[name=’username’]').val();password = $('[name=’password’]').val();csrf = $('[type=’hidden’]').val();console.log(username,password,csrf);{# 🌈post提交 #}{# $.post('地址',{參數(shù)},function(返回值){}) #}$.post('/user/register/',{’username’:username,’password’:password,’csrfmiddlewaretoken’:csrf},function(data){ console.log(data)}) });</script>
方法二：提交表單中的所有字段
console.log($(“form”).serialize()
serialize是把表單中的字段序列化，弄成get的請求的字符串格式，將其作為參數(shù)傳給后臺(tái)
值得注意的是這里就不能像方法一里那樣想傳什么參數(shù)就傳什么參數(shù)了，而是表單中所有的字段都會(huì)被納為請求的字符串格式
接下來看看代碼中是如何實(shí)現(xiàn)的，重點(diǎn)關(guān)注帶有下方標(biāo)記的代碼
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>注冊</title> {# 引用jquery #} <script src='https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js'></script></head><body><form ation='' method='post'> {# 防止跨站攻擊 #} {% csrf_token %} 用戶名：<input type='text' name='username'><br> 密碼：<input type='text' name='password'><br><!-- {# 表單提交 #}--><!-- <input type='submit'>--><!-- {# ajax提交 #}--> <input type='button' value='注冊' id='button'></form></body></html><script>{# 🌈ajax #} $('#button').click(function(){console.log($('form').serialize());{# 🌈post提交 #}{# $.post('地址',{參數(shù)},function(返回值){}) #} $.post('/user/register/',console.log($('form').serialize()),function(data){ console.log(data)}) });</script>總結(jié)
到此這篇關(guān)于django學(xué)習(xí)之a(chǎn)jax post傳參的文章就介紹到這了,更多相關(guān)django之a(chǎn)jax post傳參內(nèi)容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！
相關(guān)文章：
網(wǎng)公網(wǎng)安備