ホームページ >ウェブフロントエンド >jsチュートリアル >jsはJsonのフロントエンドとバックエンドの送信を実装します。
今回は、Json のフロントエンドとバックエンドの送信を実現するための js について説明します。 js が Json のフロントエンドとバックエンドの送信を実現するための 注意事項 については、次のとおりです。見てください。
どのフレームワークを使用する場合でも、コントローラーから HTML ページまたは JSP ページにデータを渡すという問題が発生します。最も一般的な方法は、Jsonstring を渡すことです。この知識について少し曖昧だったので、ここで整理してみます。
【Jqueryの基本的な方法】
値の転送を実現するためによく使われる方法は、Jqueryと内部的にカプセル化されたajaxです。まず、jquery の get() および post() 構文を見てください。 get() メソッドは、サーバーからデータを取得します。その主なパラメーターは、バックグラウンド リクエスト アドレスと、処理を担当する コールバック関数 を取得することです。 HTTP postメソッド:
$.post(URL,data,callback);$("button").click(function(){ $.get("demo_test.php",function(data,status){ alert("数据: " + data + "\n状态: " + status); }); });【spring mvcフレームワーク + Jquery ajax】
spring mvcフレームワークのコントローラーはMap$("button").click(function(){
$.post("/try/ajax/demo_test_post.php",
{
name:" 撒",
url:"http://www.php.com"
},
function(data,status){
alert("数据: \n" + data + "\n状态: " + status);
});
});
@RequestMapping("update") @ResponseBody //此批注是ajax获取返回值使用 public Map<String,Object> update(Long num,BigDecimal amount){ map<string,Object> resultMap=new HashMap<string,Object>(); if(num==null || agentId==null || amount==null){ resultMap.put("result","参数不合法"); return resultMap; } resultMap.put("result",result); }</span></p> js で定義されたパラメーターが永続化層で定義された javabean と一致する場合、コントローラー層はエンティティを受け取ることもできます。 <p style="text-align: left;"><strong></strong></p>【MUIバインディングデータ例】<p style="text-align: left;"></p> <p style="text-align: left;"><span style="color: #ff0000">コントローラーが取得したjson値はjqueryを使うと簡単に取得できます。では、json値を操作してページコントロールにバインドするにはどうすればよいでしょうか。まず、json の構造を簡単に理解しましょう: <strong><pre class="brush:php;toolbar:false">var params={}; params.num=num; params.id=id; params.amount=amount; $.ajax({ async:false, type:"post", url:"uset/update", data:params, dataType:"json", success:function(data){ if(data.result=='success'){ alert('修改成功'); }else{ alert('修改失败'); } }, error:function(data){ alert(data.result); } })上で定義した Json オブジェクトのように、{} はオブジェクトを表し、[] は配列を表し、"" は属性または値を表し、: は後者をその値として表します。前者。
json オブジェクトの値を取得します:
var name=employees[0].name;変更: employees[0].name="LiMing";
MUI フレームワークでのアプリケーション例、実装li タグをリストに追加します:
var employees=[{"name":"Jon","age":12},{"name":"Tom","age":14}];
[概要]
xml ファイルと比較して、json 形式のデータは高速で安定した転送速度を備えており、フロントエンド設計に非常に適しています。 この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書:HTMLフィールドを含む文字列をHTMLタグに変換する
以上がjsはJsonのフロントエンドとバックエンドの送信を実装します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。