您好,登錄后才能下訂單哦!
使用簡單例子,表單的的輸入,將表單輸入以JSON的形式傳入,并后臺返回JSON格式,使用js函數處理,進行顯示,進一步熟悉了ajax的用法,以及JSON的的使用。例子如下:
html部分: <form action="test1.php" method="get" onsubmit="return check();"> <label for="username">用戶名 </label><input type="text" placeholder="請輸入用戶名" id="username"><br> <label for="usernum"> 學號 </label><input type="text" placeholder="請輸入學號" id="usernum" onblur="checkform();"><br> <input type="submit" value="提交"> <div id="tips"></div> </form> js部分: <script> var xmlobj; var result=false; function createXMLHttpRequest(){ if(window.ActiveXObject){ xmlobj=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest){ xmlobj=new XMLHttpRequest(); } } function check(){ if(resultform()){ return true; } else{ return false; } } function checkform(){ var usernameobj=document.getElementById('username').value; var usernumobj=document.getElementById('usernum').value; var data={username:usernameobj,usernum:usernumobj}; var jsonobj=JSON.stringify(data);//將對象轉換為JSON串,通過ajax進行傳遞 var cb = ajaxResultdeal; url='test.php?data='+jsonobj+"&r="+Math.random(); toAjax(url,cb); } function toAjax(url,callback){ createXMLHttpRequest(); xmlobj.onreadystatechange=function(){ if(xmlobj.readyState==4&&xmlobj.status==200){ callback(xmlobj.responseText); } else{ result=false; } } xmlobj.open("GET",url,true); /*xmlobj.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlobj.send(data);*/ xmlobj.send(null); } function ajaxResultdeal(response){ var tips=document.getElementById('tips'); var json=JSON.parse(response); if(json['username']=="11"){ tips.innerHTML="<h2>你輸入的名字是:"+json['username']+"</h2>"; result=true; } else{ tips.innerHTML="<h2>你輸入的有誤</h2>"; result=false; } resultform(); } function resultform(){ if(result){ return true; } else{ return false; } } </script> php部分: <?php header("Content-Type:application/json;charset=utf-8"); $data = json_decode($_GET['data'],true); echo $_GET['data']; ?>
效果圖:
當用戶名為11時,輸入正確,如圖:
當用戶名不是11時,輸出為:
免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。