ajax 请求后台数据(及使用FormData对象提交表单及上传图片)

前端之家收集整理的这篇文章主要介绍了ajax 请求后台数据(及使用FormData对象提交表单及上传图片)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
js
        <script type="text/javascript"> $(function(){ $('#submit').click(function(){ var username = $('#username').val(); var password = $('#password').val(); var xhr = null; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { xhr = new ActiveXObject('Microsoft.XMLHTTP'); } var url = 'http://localhost/PHP_pro/ci/user/login'; var data = "username=" + username + "&password=" + password; //注意等号左右边不要留有空格!!! xhr.open('post',url,true); xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xhr.send(data); xhr.onreadystatechange = function() { if (xhr.readystate == 4) { if (xhr.status == 200) { alert(responseText); } } } }); }); </script>

    Jquery
        <script type="text/javascript"> $(function(){ $('#submit').click(function(){ var username = $('#username').val(); var password = $('#password').val(); $.ajax({ data:{"username":username,"password":password,"first":false},//要发送的数据  type:"POST",//发送的方式  url:"login",//URL地址  error:function(msg){ //处理出错的信息  var errormessage="再试一次"; $(".loginerror").html(errormessage); },success:function(msg){ //处理正确时的信息  //alert("success" + msg)  alert(msg); if(msg=='登录成功'){ var errormessage="登录成功"; $(".loginerror").html(errormessage); location.href = "user_center" }else{ var errormessage="用户名或密码错误"; $(".loginerror").html(errormessage); } } }); }); </script>

使用html5 FormData对象提交表单及上传图片
把以上2种方式中的数据替换成formdata即可!

var formdata = new FormData();  
formdata.append('name','fdipzone');  
formdata.append('gender','male'); 
或者
var form = document.getElementById('form1'); 
var formdata = new FormData(form); 
     ps:<form id='form1'>...</form>

猜你在找的Ajax相关文章