首页 > Web开发 > 详细

ajax的简单使用

时间:2019-06-19 12:29:33      阅读:129      评论:0      收藏:0      [点我收藏+]

对ajax的理解:

Ajax是一门网页异步交互技术,

DOM模型是Ajax最本质的技术

Ajax是“Asynchronous JavaScript + XML的简写

中文名称定义为异步的JavaScript和XML

使用ajax技术不必刷新整个页面,只需对页面的局部进行更新;

有时候同一个页面同时访问很多次同一个servlet或者controller层,明明代码没有问题,但是有些数据或者下拉框出不来,或者是数据出来不完整,不完全。因为默认的async: false。这个时候就需要考虑异步的问题了。一般在script标签里加上这句代码就好了。

$.ajaxSettings.async=false;
技术分享图片

 

下面举一个简单的例子:

不刷新页面从后台获取int类型的值。

Html代码:

<input id="linkmanId">
技术分享图片

Ajax代码:

$.ajax({

        url:"${ctx}/servlet/PNRServlet?type=newid",//请求地址

        type:"post",//请求方式为post、get

        //data:{"b":linkmanIds},//请求数据

        //data : $(‘#form1‘).serialize(), //序列化输出字符串类型的结果

        datatype:"json",//服务器返回的数据类型

        success:function(result){//ajax成功时调用success //result返回的数据

//也可以把if条件判断写成if (result.resultCode == 200) { //200状态码 = 成功 

     layer.alert("获取数据成功!" ,{icon:0,title:"提示"} ); 

         $("#linkmanId").val(result);

        },

        error:function(){//ajax失败是调用方法

                layer.alert("获取数据失败!" ,{icon:0,title:"提示"} ); 

        }

});
技术分享图片

后台代码:

public void newid(HttpServletRequest request,

            HttpServletResponse response) throws ServletException, IOException {

        response.setContentType("text/html;charset=utf-8");

        int b = ip.selectValue();//调用实现类中写的一个获取值的方法    

//int转换成json对象的时候取到的值会是空的,

//因为json对象和json字符串不一样,json对象要有键值对(key,value)

//所以在int类型转JSON的时候需要先将int类型转换成String类型,再进行转换

        String v =  String.valueOf(b);

//String a=Integer.toString(b); //这种也可以把int转为String类型

        JSONArray arrays = new JSONArray();

        arrays.add(v);

        PrintWriter outs = response.getWriter();

        outs.write(v);

        outs.flush();

        outs.close();      

    }
技术分享图片

得到的input的结果:技术分享图片技术分享图片?

在网页上按F12对js代码进行断点:

技术分享图片技术分享图片?

 

ajax的简单使用

原文:https://www.cnblogs.com/yllaxmj/p/11050360.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!