JS遍历全部内容【代码】

1.在一些前台应用中或AJAX应用的时候,我们经常会遇到填充或取得整个form的需求。如果一个个的值去复制,很显然。数十个字段,很难想象,情况惨不忍睹啊。污染了页面是小,可是加大啦劳动量。
 
可以参考下面的代码。有空的时候,可以自己动手写一个Jquery 的插件。2个方法,一个自动获取form中的值,这个方法意义不大,因为现有的jquery.form插件formSerial()方法做到了。但是该插件好像没有对form 控件进行填充的功能。 有空,研究下。
 
下面的代码,是从某网站copy下来的,仅为自己做个参考而已!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script type="text/javascript">
        function getFrmQryStr(frmID) {
            var obj = eval("document." + frmID);
            if (obj == null)
                obj = document.getElementById(frmID);
            if (obj == null) return "";
            var i, queryString = "", and = "";
            var item; // for each form's object
            var itemValue; // store each form object's value
            var frmtype = obj.nodeName.toUpperCase();
            if (frmtype == "FORM") {
                for (i = 0; i < obj.length; i++) {
                    item = obj.elements[i]; // get form's each object
                    if (item != null && item.name != undefined && item.name != '') {
                        if (item.type == 'select-one') {
                            itemValue = item.options[item.selectedIndex].value;
                        }
                        else if (item.type == 'checkbox' || item.type == 'radio') {
                            if (item.checked == false) {
                                continue;
                            }
                            itemValue = item.value;
                        }
                        else if (item.type == 'button' || item.type == 'submit' || item.type == 'reset' || item.type == 'image') {
                            continue;
                        }
                        else {
                            itemValue = item.value;
                        }

                        itemValue = encodeURIComponent(itemValue);
                        queryString += and + item.name + '=' + itemValue;
                        and = "&";
                    }
                }
            }
            else if (frmtype == "DIV") {
                queryString = getFrmValues(obj);
            }
            return queryString;
        }

        function getFrmValues(obj) {
            var item = null;
            var itemValue = null;
            var str = "";
            for (var i = 0; i < obj.childNodes.length; i++) {
                item = obj.childNodes[i];
                if (item == null || item == undefined) continue;
                if (item.name != undefined && item.name != null && item.name != '') {
                    if (item.type == 'select-one') {
                        itemValue = item.options[item.selectedIndex].value;
                    }
                    else if (item.type == 'checkbox' || item.type == 'radio') {
                        if (item.checked == false) {
                            continue;
                        }
                        itemValue = item.value;
                    }
                    else if (item.type == 'button' || item.type == 'submit' || item.type == 'reset' || item.type == 'image') {
                        continue;
                    }
                    else {
                        itemValue = item.value;
                    }
                    itemValue = encodeURIComponent(itemValue);
                    if (str != "") str += "&";
                    str += item.name + '=' + itemValue;
                }
                if (item.childNodes.length > 0) {
                    var temp = getFrmValues(item);
                    if (temp != "") {
                        if (str != "") str += "&";
                        str += temp;
                    }
                }
            }
            return str;
        }

        function getdata() {
            var str = getFrmQryStr("div");
            alert(str);
        }
    </script>

</head>
<body>
    <div>
        <form id="frm" name="frm" action="" method="post">
        <div id="div">
            <input type="text" id="txt1" name="txt1" value="1" />
            <div>
                <input type="text" id="txt2" name="txt2" value="2" />
                <select id="sel" name="sel">
                    <option value="hxh" selected="selected">China</option>
                </select>
                <input type="hidden" id="Text1" name="txt3" value="hidden" />
                <input type="checkbox" id="chk" name="chk" value="chk     " checked="checked" />
                <input type="radio" id="rad1" name="rad" value="1111" />
                <input type="radio" id="Radio1" name="rad" value="1222" />
                <input type="radio" id="Radio2" name="rad" value="13333" checked="checked" />
                <span>
                    <input type="text" id="txt3" name="txt3" value="3" /></span>
            </div>
        </div>
        <input type="text" id="txt4" name="txt4" value="4" />
        </form>
        <input type="text" id="txt5" name="txt5" value="5" />
        <br />
        <button onclick="getdata()">
            Submit</button>
    </div>
</body>
</html>

你可能感兴趣的:(JavaScript,遍历,职场,休闲)