获得所有表单值的JQuery实现代码[IE暂不支持]

IE 暂不支持
CSS：
复制代码代码如下:
<style>
        body{
             margin:0;
             padding:0;
        }
        div{
            margin:0;
            padding:0;
        }
        .container{
            margin-left:10%;
            margin-right:10%;
        }
        ul li{
            list-style:none;
        }
        ul{
            padding:0;
            margin:0;
        }
        p.em{
            color: red;
            border:1px solid red;
            padding:0 10px;
            margin:0;
        }
        p.small {line-height:90%}
        p {line-height:110%}
        #left{
            float:left;
            width:300px;
            padding:0;
            margin:0 10px 0 0 ;
            border-right:1px solid #AECEEB;
        }
        #right{
            margin-left:300px;
        }
        span.clear{
            clear:both;
        }
        h2{
            border-bottom:1px solid #AECEEB;
        }
    </style>

JS：
复制代码代码如下:
function form（）{
        $（"#myform"）.submit（function（） {
            // get text value
            var tv = $（"#mytxt"）.val（）,
                    tf = $（this）.find（":input[type="text"]"）.val（）,
                    tn = $（this）.find（":input[name="txtname"]"）.val（）;
            $（"#result1"）.text（tv）;
            /*$（"#result1"）.append（"You can get the value of text use these methods below: <br />"
                            + "<b>" + tv + "</b>" + "<br />"
                            + "<p class="em">" + "$（"#mytxt"）.val（）" + "<br />"
                            + "$（this）.find（":input[type="text"]"）.val（）" + "<br />"
                            + "$（this）.find（":input[name="txtname"]"）.val（）" + "<br />"
                            + "</p>"）;
            */
            //$（"#result1"）.delay（30000）.fadeOut（）;
            //tv.attr（value, ""）; clean value
            // get textarea value
            var av = $（"#myarea"）.val（）;
            $（"#result2"）.text（av）;
            /*    $（"#result2"）.append（"You can get the value of textarea use these methods below: <br />"
                            + "<b>" + av + "</b>" + "<br />"
                            + "<p class="em" >$（"#myarea"）.val（）"
                            + "</p>"）;
            */
            //$（"#result2"）.delay（30000）.fadeOut（）;
            var str = "";
        /*    $（"select"）.change（function （） {
          $（"select option:selected"）.each（function （） {
                str += $（this）.val（）;
              }）;
          $（"#result3"）.text（str）;
        }）
        .trigger（"change"）;
        */
        // $（"select[name="garden"] option:selected"） if we have multiple select
        $（"select[id="mysel"] option:selected"）.each（function （） {
          str = $（this）.val（）;
        }）;
        $（"#result3"）.text（str）;
        var str2 = "";
        $（"select[id="multisel"] option:selected"）.each（function （） {
          str2 += $（this）.val（） + " ";
        }）;
        $（"#result4"）.text（str2）;
        var str3 = [];
        $（"input[name="checkme"]:checked"）.each（function（）{
                 str3.push（$（this）.val（））;
        }）;
        var oa = "";
        $.each（str3, function（key,val）{
            oa += key + ":" + val;
        }）;
        $（"#result5"）.text（oa）;
        var ck = $（"input[type="radio"]:checked"）.val（）;
        $（"#result6"）.html（ ck + " is checked！" ）;
            return false;
        }）;
    }
    form（）;

HTML：
复制代码代码如下:
<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div class="container">
<h2>Get All Form Elments Value</h2>
<div id="left">
<form id="myform">
    <ul>
        <li>
        <p class="small">Text</p>
        <input type="text" name="txtname" id="mytxt" value="" />
        </li>
    <li>
        <p class="small">TextArea</p>
        <textarea name="myarea" id="myarea" value=""></textarea>
    </li>
    <li>
        <p class="small">Single Select</p>
        <select id="mysel">
            <option name="apple">Apple</option>
            <option name="blue">Blue</option>
            <option name="mary">Mary</option>
            <option name="asia">Asia</option>
        </select>
    </li>
    <li>
    <p class="small">Multiple Select</p>
    <select name="garden" multiple="multiple" id="multisel">
    <option>Flowers</option>
    <option selected="selected">Shrubs</option>
    <option>Trees</option>
    <option selected="selected">Bushes</option>
    <option>Grass</option>
    <option>Dirt</option>
    </select>
    </li>
    <li>
        <p class="small">Check Box</p>
        apple <input type="checkbox" value="apple" name="checkme" />
        banana <input type="checkbox" value="banana" name="checkme" />
        pear <input type="checkbox" value="pear" name="checkme" />
        cherry <input type="checkbox" value="cherry" name="checkme" />
        strawberry <input type="checkbox" value="strawberry" name="checkme" />
    </li>
    <li>
        <p class="small">Radio</p>
        <div>
    <input type="radio" name="fruit" value="orange" id="orange">
    <label for="orange">orange</label>
        </div>
        <div>
            <input type="radio" name="fruit" value="apple" id="apple">
            <label for="apple">apple</label>
        </div>
        <div>
            <input type="radio" name="fruit" value="banana" id="banana">
            <label for="banana">banana</label>
        </div>
    </li>
    <li>   </li>
        <li><button>submit</button></li>
    </ul>
</form>
</div>
<span class="clear"></span>
<div id="right">
<div id="result1"></div>
<div id="result2"></div>
<div id="result3"></div>
<div id="result4"></div>
<div id="result5"></div>
<div id="result6"></div>
<div id="result7"></div>
</div>
</div>
</body>
</html>