继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Ajax 学习手记 Jquery实现

qq_小火车_04020340
关注TA
已关注
手记 11
粉丝 7
获赞 194

一、 JSON格式

  1. JSON语法规则
    例子:
    {
    "staff":[
    {"name":"波波","age":25} // 所有都用双引号
    {"name":"慧慧","age":23}
    {"name":"可乐","age":3}
    ]
    }
  2. JSON的解析 JSON.parse()
    var jsondata = ‘{ "staff":[ {"name":"波波","age":25} {"name":"慧慧","age":23} {"name":"可乐","age":3}]’;
    var jsonobj = JSON.parse(jsondata) // 解析名为jsondata的字符串
    alert(jsonobj.staff[0].name); //弹出波波

二、 用Jquery实现Ajax请求
<script>
$(document).ready(function(){
$("#search").click(function(){ //定义search按钮按下事件
$.ajax({ // 定义ajax
type:"GET", //定义type类型,POST或GET,默认为GET
url:"serverjson.php?number="+$("#keword").val(), //发送请求的地址
dataType:"json", //预期服务器返回的数据类型,一般设置为json
success:function(data){ //请求成功后的回调函数,传入返回后的数据
if(data.success){ 如果返回的data.success值为真
$("#searchresult").html(data.msg) // 将data.mag的值传给一个对象
}else{
$("#searchresult").html("出现错误:"+data.msg)
}
},
error:function(jqXHR){ 请求失败时调用此函数,传入XMLHttpRequest对象
alert("发生错误:"+jqXHR.status); 提示XHR代码,即错误代码
}
});
});

    $("#addinform").click(function(){
    $.ajax({
        type:"post",
        url:"serverjson.php",
        dataType:"json",
        data:{              //是一个对象,连同请求发送到服务器的数据
            name:$("#staffname").val(),
            number:$("#staffnumber").val(),
            sex:$("#select").val(),
            job:$("#stuffposition").val(),
        },
        success:function(data){
        if(data.success){
            $("#addresult").html(data.msg)
            }else{
            $("#addresult").html("出现错误:"+data.msg)
            }
        },
        error:function(jqXHR){
            alert("发生错误:"+jqXHR.status);
        }
    });
});

});

</script>

打开App,阅读手记
6人推荐
发表评论
随时随地看视频慕课网APP

热门评论

少了JSP页面的表单,虽说也能猜出来……

查看全部评论