jquery ajax请求参数和返回数据的处理

发布时间:2019-05-21 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了jquery ajax请求参数和返回数据的处理脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

刚接触学会用jQuery ajax的时候,觉得真东西好神奇,这样就可以把数据取回来了啊。然后我可以把取回来的数据渲染到页面上,一颗赛艇。
之前很早接触到项目,并不知道怎么优雅的去用jquery ajax(现在也不优雅);
那个时候看别人写的代码

$.post("","",...)

也有

$.get("","",...)

还有

$.ajax()

当然现在知道点,这些写法都是一个意思,还是习惯用$.ajax()写写吧。
之前的数据处理,发送数据请求(json的数据格式),然后自己通过下面的方式

VAR request = {};
request.name = $(".name").val();
request.age = $(".age").val();
request.sex = $(".sex").val();
//...

当时表单发送的参数项少,所以没觉得什么,到后来一个表单很多项数,也这么写,结果request手工写了好多行,虽然能用吧,但是看看这样的代码就觉着哪里不对劲吧,至少很不“优雅”。
后来,发现其实jquery有个serialize的方法可以序列化表单数据,可以省事很多。
w3c_jquery_serialize-demo

处理返回数据,渲染到页面上去。
之前的做法也是和上面一模一样的吧,返回的数据是json数据格式的,然后分别取值赋值给页面元素,所以代码往往是这样的。

jquery ajax请求参数和返回数据的处理

如果数据再多点,真的是感觉略难看。其实应该是有更好的做法的,返回的是一个json对象,所以我们可以通过遍历对象的属性值取到所有值然后依次渲染到页面对应元素即可。
对象遍历可以用for-in来写(有更好的方法来写么?)

$.ajax({
    //...
    success:function(result){
        for(var v in result){
            // 如果渲染的元素都是统一的输入框形式的话,
            $("form").find("input[name="+ v +"]").val(result[v]); 

            // 如果有其他元素 则另外单独校验处理
        }
    }

})

上面name(或者其他tag在页面中先写好,和返回数据的属性一致)。

如果有什么更好的方案,请指教,谢谢!
另外摘记一个表单输入框中回车 自动提交的情况和处理方案

脚本宝典总结

以上是脚本宝典为你收集整理的jquery ajax请求参数和返回数据的处理全部内容,希望文章能够帮你解决jquery ajax请求参数和返回数据的处理所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。