javascript请求servlet实现ajax示例(分享)

 更新时间:2017年06月03日 10:58:45   投稿:jingxian  
下面小编就为大家带来一篇javascript请求servlet实现ajax示例(分享)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

ajax请求是一种无刷新式的用户体验,可以发送GET和POST两种异步请求,现记录如下:

GET请求:

function sendRequestByGet(){
     //定义异步请求对象
    var xmlReq;
    //检测浏览器是否直接支持ajax
    if(window.XMLHttpRequest){//直接支持ajax
      xmlReq=new XMLHttpRequest();
    }else{//不直接支持ajax
      xmlReq=new ActiveObject('Microsoft.XMLHTTP');
    }
    
     //设置回调函数
     xmlReq.onreadystatechange=function(){
       if (xmlReq.readyState==4&&xmlReq.status==200) {
         //获取服务器的响应值
        var result=xmlReq.responseText;
         //后续操作
         alert(result);
      }
     };
     
     //创建异步get请求
     var url="Hello?name=zhangsan";
     xmlReq.open("GET",url,true);
     //发送请求
     xmlReq.send(null);
   }

POST请求:

function sendRequestByPost(){
     //定义异步请求对象
    var xmlReq;
    //检测浏览器是否直接支持ajax
    if(window.XMLHttpRequest){//直接支持ajax
      xmlReq=new XMLHttpRequest();
    }else{//不直接支持ajax
      xmlReq=new ActiveObject('Microsoft.XMLHTTP');
    }
    
     //设置回调函数
     xmlReq.onreadystatechange=function(){
       if (xmlReq.readyState==4&&xmlReq.status==200) {
         //获取服务器的响应值
        var result=xmlReq.responseText;
         //后续操作
         alert(result);
      }
     };
     
     //创建异步Post请求
     var url="Hello";
     xmlReq.open("POST",url,true);
     xmlReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
     //发送请求
     var data="name=lisi";
     xmlReq.send(data);
   }

ajax请求的servlet:

@Override
  protected void doPost(HttpServletRequest req, HttpServletResponse resp)
      throws ServletException, IOException {
    String name=req.getParameter("name");
    PrintWriter out = resp.getWriter();
    out.print(name);
  }

效果:

以上这篇javascript请求servlet实现ajax示例(分享)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Ajax的特性及乱码问题

    Ajax的特性及乱码问题

    ajax的全称是asynchronous javascript and XML ,它是异步的js和XML。它是局部刷新,异步操作。这篇文章给大家介绍了ajax的特性及乱码问题,感兴趣的朋友一起看看吧
    2017-07-07
  • ajax结合mysql数据库和smarty实现局部数据状态的刷新方法

    ajax结合mysql数据库和smarty实现局部数据状态的刷新方法

    下面小编就为大家分享一篇ajax结合mysql数据库和smarty实现局部数据状态的刷新方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12
  • ajax请求json数据案例详解

    ajax请求json数据案例详解

    最近项目有这样一个需求,点击六大洲,出现对应的一些请求信息,展示在下面,当请求之后,第二次点击就不用再次请求了,究竟用代码怎么写呢,下面小编带领大家了解了解
    2015-09-09
  • ajax实现文件异步上传并回显文件相关信息功能示例

    ajax实现文件异步上传并回显文件相关信息功能示例

    这篇文章主要介绍了ajax实现文件异步上传并回显文件相关信息功能,结合实例形式分析了基于jQuery $.ajax方法的文件异步上传以及后台java程序对文件信息的读取与显示相关操作技巧,需要的朋友可以参考下
    2018-06-06
  • 深入理解ajax系列第一篇之XHR对象

    深入理解ajax系列第一篇之XHR对象

    ajax是asynchronous javascript and XML的简写,中文翻译是异步的javascript和XML,这一技术能够向服务器请求额外的数据而无须卸载页面,会带来更好的用户体验
    2016-11-11
  • ajax实现修改功能

    ajax实现修改功能

    本文主要介绍了ajax实现修改功能的相关资料,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-04-04
  • SSH+Jquery+Ajax框架整合

    SSH+Jquery+Ajax框架整合

    这篇文章给大家介绍基于SSH+Jquery+Ajax整合实现局部刷新,感兴趣的朋友一起看看本文吧
    2015-10-10
  • Ajax 实现加载进度条

    Ajax 实现加载进度条

    本文给大家介绍ajax实现加载进度条效果,非常不错,具有参考借鉴价值,需要的朋友参考下
    2016-12-12
  • Ajax实现智能提示搜索功能

    Ajax实现智能提示搜索功能

    这篇文章主要为大家详细介绍了Ajax实现智能提示搜索功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • 空格或者空白字符导致$.ajax()报parseerror错误小结

    空格或者空白字符导致$.ajax()报parseerror错误小结

    这篇文章主要介绍了空格或者空白字符导致$.ajax()报parseerror错误,需要的朋友可以参考下
    2014-04-04

最新评论