DjangoのAjaxの操作

アヤックス

AJAX（非同期JavaScriptおよびXML）、JavaScriptは非同期ネットワークを実行するための要求として理解することができます。単語の人気の理解なしAjax技術が存在しない場合、（それはテキスト、画像のラインであっても）ページの小さな部分を変更したら、ページ全体をリロードする必要があります、その後、アヤックスで、ページ上達成することができますがジャンプしないではありませんページの背景、更新ページのコンテンツの一部にデータを提出するよう、ケースを更新します。

ブラウザがHTTP要求を行い、HTTP応答を受信するようにコアが、ブラウザによって提供されるXMLHttpRequestオブジェクトに依存していることを特徴とします。ブラウザは、その後、XHRの復帰など、他のものは、ページを再レンダリングするデータを受信しますか

アヤックスではJQuery

ネイティブのAjaxにjQueryのは、非常に簡単に、このような特定のメソッドの多くは非常に良いパッケージをしました $アヤックス、$ .post、$に.get、$ .getJSONなどをすることができます、次のモードで各種パラメータを書かれた、シンプルな分析を行うには、より簡潔な書き込み、$アヤックス例を呼び出すために異なるニーズに基づいて行うことができます成功したAjaxリクエストは、そして、実際には$ .postを使用することができます $.getどちらの方法は、より多くのを使用していますが、理解すること$ 、この一般的な方法アヤックスは、カプセル化の原理をよく理解していることができます。

 $.ajax({
 	type: //数据的提交方式：get和post
 	url: //请求地址
 	async: //是否支持异步刷新，true（异步）或 false（同步）
 	data: //需要提交的数据
 	dataType: //服务器返回数据的类型，例如xml,String,Json等
 	success:function(data){
 	} //请求成功后的回调函数,参数data就是服务器返回的数据
 	error:function(data){
 } //请求失败后的回调函数，根据需要可以不写，一般只写上面的success回调函数
 })

AjaxのjQueryのは、コールバック、成功、エラー、完全な3をカプセル化された最も一般的である：
成功：成功したコールバック要求の後に
エラー：コールバック要求に失敗しました。
完了：要求（リクエストが成功または失敗と呼ばれている）コールバック関数を完了しています。

限り、要求に関係なく、成功または失敗の呼び出します、完了すると完了します。完全と呼ばれる順番に、必ずしも成功を呼び出しません。それはあなたが成功を呼び出す場合、完全呼ぶようです。（ステータスコード404403301302は...限り間違いが呼び出されませんよう、完全に入力されます）

前部および後部は、送信データの符号化形式のcontentTypeを終了します

URLエンコード
データ形式に対応する：名前linwowl＆パスワード666 = =
バックエンドデータ取得：request.POST
PSは、Djangoが自動的request.POSTに符号化されたデータを解析するURLエンコード
FORMDATA
符号化フォーマット形式のファイル転送構成
ファイル形式のデータ取得の後端：request.FILESは
データを取得後、共通鍵：request.POSTを
ファイルアプリケーション/ JSON
Ajaxのデータ伝送フォーマットJSON

Ajaxのデフォルトの送信データの符号化形式がURLエンコードされます。フロント及びリアエンドデータを送信する場合、データは符号化に対応

データ転送フォーマットのAjaxのJSON

$('#d1').click(function () {
	$.ajax({
		url:'',  // url参数可以不写，默认就是当前页面打开的地址
		type:'post',
		contentType:'application/json',
		data:JSON.stringify({'name':'llinwow','hobby':'study'}),
		success:function (data) {}
	})
});

Ajaxの転送ファイル

$('#d1').click(function () {
	let formdata = new FormData();
	// FormData对象不仅仅可以传文件还可以传普通的键值对
	formdata.append('name','llinwow');
	// 获取input框存放的文件
	//$('#i1')[0].files[0]
	formdata.append('myfile',$('#i1')[0].files[0]);
	$.ajax({
		url:'',
		type:'post',
		data:formdata,
		// ajax发送文件需要修改两个固定的参数
		processData:false,  // 告诉浏览器不要处理我的数据
		contentType:false,  // 不要用任何的编码，就用我formdata自带的编码格式，django能够自动识别改formdata对象
		// 回调函数
		success:function (data) {
			alert(data)
		}
	})
});

類似点と相違点を持つフォームAjaxフォーム

フォームの送信フォームは、非同期パーシャルリフレッシュをサポートしていません。
フォームフォームのトランスポート、JSON形式のデータをサポートしていません。
データを送信するためのデフォルトのエンコーディングフォーマットでAjaxフォームフォームはURLエンコードされています

利点：

ページを更新せずに、ページ内のため、待機時間を短縮し、ユーザーエクスペリエンスを向上させる、サーバーと通信します。
サーバとの非同期通信を使用して、レスポンスが速くなります。
元のサーバーの中には、ブロードバンドリースのスペースとコストを節約し、サーバおよび帯域幅の負担を軽減、アイドル処理するクライアントの機能を使用して、クライアントに転送する作業することができます。
プラグインやアプレットをダウンロードすることなく、標準化し、広くサポートされている技術に基づいています。

短所：

戻るブラウザのバック・ページでサポートされていないこと、操作することはできません。
検索エンジンのサポートは比較的弱いです。
例外処理メカニズムは、プログラムに影響を与える可能性があります。

アヤックス

アヤックスではJQuery

おすすめ