Ajax設定の詳細、Ajax呼び出しの説明、Ajax中国語文字化け、Ajaxフォーム送信（例付き）

この記事ではajaxの使い方の概要を中心に、ajaxの設定、呼び出し、中国語文字化け、フォーム送信などについて詳しく解説しています。 それでは、この記事も一緒に見ていきましょう

· jquery
0. jquery.js を最初に導入する必要があります。そうしないと、jquery フレームワークを呼び出すことができません
1. js は大文字と小文字が区別されるため、名前を付けるときに注意してください
2. jquery は ID に基づいてページ テキストの値を取得しますp の属性: $("#demoID" ).val()、クラス属性 $(".demoCLASS").val() に基づいてページ テキストの値を取得します (割り当ての場合 $("#demoID) ").val("割り当てられたパラメータ")
3. $( document).ready(function(){code})、$().ready(function(){code})、$(function(){code} ) は同じ意味です
4. 複数の $(function(){ Code}) は共存できます。つまり、名前が繰り返されない限り、同時に動作できます
5. $(function(){code} }) は、自動クリック、自動ポップアップ、クリック監視またはその他の監視など、ページが読み込まれるとすぐに実行されることを意味します
6. 読み込み後のクリックと「クリック監視」の違い (非常に参考になります) )
たとえば、現在は js メソッドがあり、 function demoFunction(){alert("This method has run");};
読み込みが完了しました つまり、クリックします: $("#demoid").click(demoFunction() );
このメソッドは、ボタンにクリック アクションがある場合、または jquery を通じて click() アクションがある場合にのみ実行できます: $("# demoid").click(function(){demoFunction ()});
7. 自動的にロードされて実行される場合、または監視する必要がある場合は、コード内の $(document).ready(function(){code}) に配置する必要があります
8. 違いwindow.onload=function(){code} と $(function(){code}) の間
·関数呼び出しの使用法が異なります:
window.onload = function(){code};
$ (function(){ code})
·関数を呼び出す時間が異なります
Window.load=function(){code}: 実行する前に、Web ページ内のすべてのコンテンツ (画像を含む) が読み込まれるまで待つ必要があります。アップロードやその他の機能として。
$(function(){code}) は、Web ページ内のすべての DOM 構造が描画された後に実行できます。
9. AJAXトピック
・必要なjarパッケージ: commons-lang-2.5.jar、commons-lang3-3.1.jar、javassist-3.11.0.GA.jar
・フロントエンドjsの書き方: 簡略化するため処理をページとして書く Loadして実行
$(document).ready(function(){
$.ajax({

url : "testajax.do",// 请求地址
//timeout : 600000,//超时时间设置，单位毫秒
async : false,// 异步
cache : false,// 缓存
type : 'post',// 请求方式
data: {"name":"123"},//data: $('#formid').serialize(),//序列化表单-当触发一个form表单提交的ajax事件的时候，这个序列化方法自动将数据转化为json格式传递给后台
dataType : 'json',// 服务器返回的数据类型
success : function(msg) {// 请求成功后调用的
alert("返回json的实验成功了"+" msg.resultcode="+msg.resultcode+" msg.name="+msg.name);
},
error :function(){
alert("异常");
}
});
      });

・ストラットの書き方。操作

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
    "http://struts.apache.org/dtds/struts-2.3.dtd">
    <struts>
    <!--略去一些struts2的配置信息-->
<package name="myajax" extends="json-default" namespace="/">
<global-results>
<result name="message" type="json">
<param name="root">message</param>
</result>
</global-results>
<action name="*" class="demo.action.AjaxTest" method="{1}">
        <result name="list">/index.jsp</result>
       </action>
</package> 
<!-- 包含的其他配置文件 -->
<include file="struts-method.xml"></include>
    </struts>

・Ajaxアプリケーションフォームフォームデータを送信する - フォームデータは自動的に json 形式に変換されます

シナリオの説明: 特定の送信情報がフォームであり、ajax を通じてバックグラウンドに渡される場合、通常はこのフォームを json 形式に変換して渡すというシーケンスを使用します。 (さらに詳しく知りたい場合は、PHP 中国語 Web サイトの

AJAX 開発マニュアル
の列にアクセスして学習してください)
·form フォームの形式、form タグには id と input タグが付いています

。

    import java.io.IOException;
    import java.io.PrintWriter;
    import java.util.HashMap;
    import java.util.Map;
    import javax.servlet.http.HttpServletResponse;
    import org.apache.struts2.ServletActionContext;
    public class AjaxTest {
protected Map<String, Object> message = new HashMap<String, Object>();
/** AJAX请求返回RESULT的name常量*/
protected final static String MESSAGE = "message";
public Map<String, Object> getMessage() {
return message;
}
public void setMessage(Map<String, Object> message) {
this.message = message;
}
//-登录页面中form表单提交的路径
public String testajax() throws IOException{
System.out.println("获取参数name="+ServletActionContext.getRequest().getParameter("name"));
message.put("resultcode", "0000");
message.put("resultcode", "0001");
message.put("name", "zhong文ce试");
return MESSAGE;
}
     }

·コードの js 部分 - 別の js ファイルに記述することができます。最初に jquery.js ファイルを導入する必要があることに注意してください

     <form  id="formid"> 
姓名：<input type="text" name="name" value="张三"/><br>
年龄：<input type="text" name="age" value="12"/><br>
<input type="submit" value="提交" id="submitid"/>
     </form>

この記事はここで終わります (さらに詳しく知りたい場合は、PHP にアクセスしてください)。中国語については、
AJAX ユーザーマニュアル

列で学習します)、ご質問がある場合は、以下にメッセージを残してください

。

以上がAjax設定の詳細、Ajax呼び出しの説明、Ajax中国語文字化け、Ajaxフォーム送信（例付き）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。