リクエストを簡素化するためにjQueryのスクリプト学習<のXMLHttpRequest>を使用してAjaxリクエスト

リクエストを簡素化するためにjQueryのスクリプトを使用します
<DOCTYPE HTML！> 
<HTML> 
<HEAD> 
<META HTTP-当量= " Content-Typeの"コンテンツ= " text / htmlの;のcharset = UTF-8 " > 
<タイトル>デモ</ TITLE> 
<スタイル> 
ボディ、入力、選択、ボタン、H1 { 
    フォント - サイズ：28px; 
    ライン -height：1.7 ; 
}
 </スタイル>     
</ head> 

<body> 

<H1>员工查询</ H1> 

<ラベル>请输入员工编号：</ラベル> 
の<input type = " テキスト" ID = "検索" >クエリ</ button>の
<P-上記ID =上記" 、検索結果" > </ p型> 

<H1>スタッフの新しい</ H1> 
<label>は、従業員の名前を入力します。</ label>は
タイプの<INPUT = " テキストを"上記のid上記= " staffName " /> <BR> 
<ラベル>従業員の数を入力してください：</ label>を
<タイプの入力= " テキスト"上記のid上記= " staffNumber " /> <BR> 
</ label>は<ラベル>は、従業員の性別を選択してください
<をSELECT ID = " staffSex " > 
<オプション>女</オプション> 
<オプション>男</オプション> 
</ 選択 > <BR> 
<ラベル>従業員の位置を入力します。</ label>は
<input type = " テキスト" ID = " staffJob " /> <BR> 
<ボタンID = " 保存"保存</ button>の> 
<p個のID = " createResult " > </ P> 

<スクリプトSRC = " のhttp：/ /apps.bdimg.com/libs/jquery/1.11.1/jquery.js " > </ SCRIPT> 
<SCRIPT> 
$（ドキュメント）.ready（関数（）{ 
    $（" #search " ）.click（関数（ ）{ 
        $アヤックス（{ 
            タイプ：" GET " 、     
            URL："http://127.0.0.1:8080/ajaxdemo/serverjson2.php?number= " + $（" #keyword " ）.val（）、
            データ型：" JSON 」、
            成功：機能（データ）{ 
                場合（data.success ）{ 
                    $（" #searchResult " ）の.html（data.msg）; 
                } 他{ 
                    $（" #searchResult "）の.html（" 出现错误：" + data.msg）; 
                }   
            }、 
            エラー：     関数（jqXHR）{
               警告（"发生错误：" + jqXHR.status）;   
            }      
        }）; 
    }）; 
    
    $（" #save " ）.click（関数（）{ 
        $アヤックス（{ 
            タイプ：" POST " 
            URL：" serverjson.php " 、
            データ：{ 
                名：$（" #staffName " ）.val（）、
                番号：$（" #staffNumber " ）.val（）、
                性別：$（" #staffSex " ）。H（） 
                ジョブ：$（" #staffJob " ）.val（）
            }、
            データ型：" JSON " 
            成功：関数（データ）{ 場合（data.success）{ 
                    $（" #createResult " ）の.html（data.msg）; 
                } 他{ 
                    $（" #createResult "）の.html（" 出现错误：" + data.msg）; 
                }   
            }、
                 
            エラー：関数（jqXHR）{      
               警告（" 发生错误：" + jqXHR.status）;   
            }      
        }）; 
    }）; 
}）;
 </ SCRIPT> 
</ BODY> 
</ HTML>
リクエストを簡素化するためにjQueryのスクリプト学習<のXMLHttpRequest>を使用してAjaxリクエスト

おすすめ
