代码如下：

<script type="text/javascript">

    // 获取指定form中的所有的<input><select>对象

    function getElements(formId) {

        var form = document.getElementById(formId);

        if(form == null){

            return false;

        }

        var elements = new Array();

        var inputTagElements = form.getElementsByTagName('input');

        for (var j = 0; j < inputTagElements.length; j++) {

            elements.push(inputTagElements[j]);

        }

        var selectTagElements = form.getElementsByTagName('select');

        for (var j = 0; j < selectTagElements.length; j++) {

            elements.push(selectTagElements[j]);

        }

        return elements;

    }

    // 获取单个input中的【name,value】数组

    function inputSelector(element) {

        if (element.checked)

            return [ element.name, element.value ];

    }

    function selectOne(element){

        var value = $(element).find("option:selected").val();

        if(value != ""){

            var name = $(element).attr("name");

            return [name, value ];

        }

    }

    function input(element) {

        switch (element.type.toLowerCase()) {

        case 'submit':

        case 'hidden':

        case 'password':

        case 'text':

            return [ element.name, element.value ];

        case 'checkbox':

        case 'radio':

            return inputSelector(element);

        case 'select-one':

            return selectOne(element);

        }

        return false;

    }

    // 组合URL

    function serializeElement(element) {

        var method = element.tagName.toLowerCase();

        var parameter = input(element);

        if (parameter) {

            var key = parameter[0];

            if (key.length == 0)

                return;

            if (parameter[1].constructor != Array)

                parameter[1] = [ parameter[1] ];

            var values = parameter[1];

            var results = [];

            for (var i = 0; i < values.length; i++) {

                results.push(key + '=' + values[i]);

            }

            return results.join('&');

        }

    }

    // 调用方法

    function serializeForm(formId) {

        var elements = getElements(formId);

        var queryComponents = new Array();

        for (var i = 0; i < elements.length; i++) {

            var queryComponent = serializeElement(elements[i]);

            if (queryComponent)

                queryComponents.push(queryComponent);

        }

        return queryComponents.join('&');

    }

</script>
<body>

　　<form id="login" name="login" method="post" action="result.jsp">

　　　　<input name="user" type="text"/>

　　　　<input name="sex" type="radio" value="man"/>

　　　　<input name="sex" type="radio" value="woman"/>

　　　　interest:<input type="checkbox" name="interest" value="piu">PIU <input type="checkbox" name="interest" value="dss">DSS <input type="checkbox" name="interest" value="ddr">DDR<br>

　　　　<input type="hidden" name="from" value="welcome"><br>

　　　　<input type="button" name="submit" value="submit" onclick="getFormInfo();">

　　</form>

</body>

function getFormInfo(){

  var params = serializeForm('login');

  alert(params);

}

js获取form表单所有数据的更多相关文章

  1. js模拟form表单提交数据, js模拟a标签点击跳转，避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  2. JS获取form表单数据

    以下代码可放在一个js文件中,以便通用: //获取指定表单中指定标签对象 function getElements(formId, label) { var form = document.getEl ...

  3. JS 获取form表单的所有数据

    在HTML中用js获取通过GET.POST方法(就是在网址后加?a=b&c=d之类)传过来的表单值. 针对大家常用的获取表单方式,很多时候都是在重复的写一些代码,今天给大家贴出来的代码可以作为 ...

  4. JS获取form表单所有属性值

    // 得到一个表单里的全部信息function getFormQueryString() { var frmID=document.forms[0]; var i,queryString=" ...

  5. JS获取form表单的所有输入值

    function getFormQueryString(frmID) { var frmID=document.getElementById(frmID); var i,queryString = & ...

  6. java：JavaScript2：（setTimeout定时器，history.go()前进/后退，navigator.userAgent判断浏览器，location.href，五种方法获取标签属性，setAttribute，innerHTML，三种方法获取form表单信息，JS表单验证，DOM对象，form表单操作）

    1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...

  7. springboot框架中集成thymeleaf引擎，使用form表单提交数据，debug结果后台获取不到数据

    springboot框架中集成thymeleaf引擎,使用form表单提交数据,debug结果后台获取不到数据 表单html: <form class="form-horizontal ...

  8. serialize可以获取form表单里面的数值

    serialize属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  9. 原生js实现form表单序列化

    当我们有form表单而且里面的表单元素较多时,咱们总不能一个个去获取表单元素内的值来进行拼接吧!这样会很让人蛋疼!为了方便与后台交互并且提高自己的开发效率,并且不让你蛋疼:我们一起用原生来写一个表单序 ...

随机推荐

  1. 【总结】web工作代码分类整理（持续更新）

    文件.blob 文件下载失败,将Blob对象转换为Json,处理异常错误? 使用FileReader,核心代码: var reader = new FileReader() reader.onload ...

  2. Java 之 异常的处理

    Java 异常处理的五个关键字:try.catch.finally.throws.throw 一.捕获异常 try...catch 如果异常出现的话,会立刻终止程序,所以我们得处理异常. try... ...

  3. tomcat启动Publishing failed with multiple errors

    转自:https://blog.csdn.net/leisurelen/article/details/46940441 新安装一个tomcat插件.启动的时候就弹错误框.但tomcat还能使用. P ...

  4. linux 账户控制

    用户 用户是能够获取系统资源的权限的集合. linux用户组的分类: 管理员 root :具有使用系统所有权限的用户,其UID 为0. 普通用户 : 即一般用户,其使用系统的权限受限,其UID为500 ...

  5. virsh console 登录CentOS7系统

    一.在kvm虚拟机中执行如下命令 systemctl start serial-getty@ttyS0.service systemctl enable serial-getty@ttyS0.serv ...

  6. python的sort和sorted

    sort 只适用于列表,返回列表类型. sorted 可适用于字典,元组和列表. 使用方法 sort的使用方法是list.sort(cmp=None, key=None, reverse=False) ...

  7. P1092 虫食算[搜索]

    这个式子是是由\(A\sim A+N\)组成的,那么\(A\sim A+N\)就只能等于\(0\sim N-1\),因此我们每次对\(A\sim A+N\)的取值做一个新的排列,然后judge一下当前 ...

  8. POJ - 1981 ：Circle and Points （圆的扫描线） hihocoder1508

    题意:给定N个点,然后给定一个半径为R的圆,问这个圆最多覆盖多少个点. 思路:在圆弧上求扫描线. 如果N比较小,不难想到N^3的算法. 一般这种覆盖问题你可以假设有两个点在圆的边界上,那么每次产生的圆 ...

  9. rsync+inotify百万级文件实时同步

    实验环境:Centos7.4 目的:将源服务器的文件实时同步至目标服务器 源服务器:10.11.1.107 目标服务器:10.11.1.106 分别在两个节点安装rsync yum -y instal ...

  10. Pychram中使用reduce()函数报错：Unresolved reference 'reduce'

    python3不能直接使用reduce()函数,因为reduce() 函数已经被从全局名字空间里移除了,它现在被放置在fucntools 模块里,所以要使用reduce函数得先饮用fucntools ...