• js获取form表单所有数据


    代码如下:

    <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 pop push unshift shift的作用与区别
    白话js this指向问题
    JS作用域,作用域,作用链详解
    angular $q promise详解
    白话$resource,$resource中的增删改查
    ng-app与ng-app='myApp'的区别
    详解 高效字节流
    详解 字节输出流 与 字节输入流
    阶段性复习与应用——复制多级文件夹
    详解 字节流
  • 原文地址:https://www.cnblogs.com/henuyuxiang/p/12010407.html
Copyright © 2020-2023  润新知