• 记录jquery的ajax


    1、直接干货

      ajax很简单jquery有很好的支持,原生js就不写了。总的说常用的有3个方法

      $.post

      $.get

      $.ajax

           具体参数参考教程http://www.runoob.com/jquery/ajax-post.html

      $.get$.post主要4个参数url,params,callback,type用法在教程很详细我就不说了

      主要说的有1点,get方法很方便,可以用,post方法尽量少用,在spring框架下接收参数不是很舒服,不能直接用对象接收参数。

    在项目应用中常要这样接收参数

    public String login(@RequestBody User user, HttpServletRequest request, HttpServletResponse response) throws UnsupportedEncodingException{

    直接用$.post接收不到User对象,只能单个传参,很麻烦,所以这里推荐用$.ajax方法

    2、

            function submitForm(){
                /*<![CDATA[*/
                     var url = /*[[@{/user/login}]]*/null;
                     if ([[${redirectURL}]] != null){
                        var redirectURL = "?redirectURL="+/*[[${redirectURL}]]*/;
                         url = url + redirectURL;
                     }
                    var params = $("#userForm").serializeJson();
                    if ($("#userMobile").val() == ""){
                        alert("手机号为空。");
                        $("#userMobile").focus();
                        return;
                    }
                    if ($("#userPassword").val() == ""){
                        alert("密码为空。");
                        $("#userPassword").focus();
                        return;
                    }
                    $.ajax({ 
                        type:"POST", 
                        url:url, 
                        dataType:"json",      
                        contentType:"application/json;charset=utf-8",               
                        data:params, 
                        success:function(result){
                            if (result.redirectURL != undefined){
                                location.href = result.redirectURL;
                            }else{
                                if (result.status == "200"){
                                    location.href = "http://localhost";
                                }else{
                                    alert(result.message);
                                }     
                            }      
                        } 
                     });
                    /*]]>*/  
                 }

    代码中标红的就是将form表单中的数据对象化,这样上面的服务器代码就可以直接用对象接收了,很方便。

    给出js的serializeJson 代码如下:

    // 把json字符串封装成json对象
    (function($) {
        $.fn.serializeJson = function() {
            var serializeObj = {};
            var array = this.serializeArray();
            var str = this.serialize();
            $(array).each(
                    function() {
                        if (serializeObj[this.name]) {
                            if ($.isArray(serializeObj[this.name])) {
                                serializeObj[this.name].push(this.value);
                            } else {
                                serializeObj[this.name] = [
                                        serializeObj[this.name], this.value ];
                            }
                        } else {
                            serializeObj[this.name] = this.value;
                        }
                    });
            return JSON.stringify(serializeObj);
        };
    })(jQuery);
  • 相关阅读:
    javascript模板方法模式
    设计模式之原型模式
    es6 工厂模式
    js建筑者模式
    程序运行时的堆栈与数据结构中的堆栈有何分别
    POJO、JavaBean、DTO的区别
    AnnotationTransactionAttributeSource is only available on Java 1.5 and higher
    进程pid理解
    Tasklist使用详解
    day 16 类的成员
  • 原文地址:https://www.cnblogs.com/PPBoy/p/7285826.html
Copyright © 2020-2023  润新知