• form表单中的带有name的标签直接转JSON


    1. 将如下内容引入页面:
    比如说新建一个 a.js,然后在页面中引入a.js
    //将form表单序列化成json格式

    $.fn.serializeObject = function () {
    var o = {};
    var a = this.serializeArray();
    $.each(a, function () {
    if (o[this.name] !== undefined) {
    if (!o[this.name].push) {
    o[this.name] = [o[this.name]];
    }
    o[this.name].push(this.value || '');
    } else {
    o[this.name] = this.value || '';
    }
    });
    return o;
    };

    2. 如果form如下所示:

    <form id="myform">
    <input type="text" id="loginName" name="loginName" class="form-control" placeholder="用户名" required="">
    <input type="password" id="empPwd" name="empPwd" class="form-control" placeholder="密码" required="">
    <button type="submit" class="btn btn-primary block full-width m-b" onclick="login();return false;">登 录</button>
    </div>
    </form>


    此时我们想通过ajax的形式交此form中的带有name的input到后台,则可以如下使用:

    <script>
    function login() {
    //ajax的形式提交表单
    var url = "<%=basePath%>/emp/login";
    var data=$("#myform").serializeObject(); //此处调用的就是我们写好的引入的方法,会将带有name的input,全部转为JSON。
    $.post(url, data, function (data) {
    if (data.result == "false") {
    alert(data.reason);
    } else {
    alert("OK");
    }
    });
    }
    </script>

    3.相比其他解决方法的优点:
    a. 当然可以利用jquery获取每一个input的值,然后手动组装成json字符串提交,此操作费时费力,如果是如上结构可以直接使用。
    b. 缺点,外层必须是form才行,注意事件需要return false;阻断原有跳转。

  • 相关阅读:
    P3146 [USACO16OPEN]248
    P2590 [ZJOI2008]树的统计
    P3379 【模板】最近公共祖先(LCA)
    P2253 好一个一中腰鼓!
    数组中出现次数超过一半的数字
    字符串的排列
    二叉搜索树与双向链表
    二叉搜索树的后序遍历序列
    从上往下打印二叉树
    顺时针打印矩阵
  • 原文地址:https://www.cnblogs.com/LiuChunfu/p/5891110.html
Copyright © 2020-2023  润新知