当前位置: 移动技术网 > IT编程>开发语言>JavaScript > javascript前端和后台进行数据交互方法示例

javascript前端和后台进行数据交互方法示例

2020年08月17日  | 移动技术网IT编程  | 我要评论
在开发中遇到了在没有jquery的情况下需要与后台进行部分数据的交互,查找了部分资料使用javascript实现了操作,记录一下。//获取xmlhttprequest对象用于与后台交互数据functi

在开发中遇到了在没有jquery的情况下需要与后台进行部分数据的交互,查找了部分资料使用javascript实现了操作,记录一下。

//获取xmlhttprequest对象用于与后台交互数据
function getxhr(){
      var xmlhttp;
      try {
        xmlhttp=new xmlhttprequest();//新版本浏览器
      }catch(e)
      {
        try{
          xmlhttp=new activexobject("msxml2.xmlhttp");
        }
        catch(e)
        {
          try{
            xmlhttp=new activexobject("microsoft.xmlhttp");//老版本浏览器          }
          catch(e)
          {
            alert("你的浏览器不支持ajax");
            return false;
          }
        }
      }
      return xmlhttp;
    }
function check() {
      var pass = document.getelementbyid("pass").value;
 
      //1/得到xhr对象
      var xhr=getxhr();
      //2.注册状态变化监听器
      xhr.onreadystatechange=function(){
        if(xhr.readystate==4) {
          if(xhr.status==200) {
            var obj = document.getelementbyid("checkpass");
            if("true" == xhr.responsetext){
              obj.innerhtml = "验证通过";
              obj.style.color = "green";
			}else{
              obj.innerhtml = "原密码输入错误!";
              obj.style.color = "brown";
              return;
			}
          }
        }
      }
      //3.建立与服务器的连接(post请求方式,也可以使用get请求方式)
      xhr.open("post","请求数据的地址");
      xhr.setrequestheader('content-type','application/x-www-form-urlencoded');
      //4.向服务器发出请求(使用post请求方式将数据发往后台)
      xhr.send("pass="+pass);
    }

到此这篇关于javascript前端和后台进行数据交互方法的文章就介绍到这了,更多相关javascript前端和后台数据交互内容请搜索移动技术网以前的文章或继续浏览下面的相关文章希望大家以后多多支持移动技术网!

如您对本文有疑问或者有任何想说的,请 点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网