jquery对表单的基本操作【转自园子->小刚I的博客】

 

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="../conn/jsfile/jquery.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    文本框 :<input type="text" id="txt" value="txt" /><br />
   
    单选按钮:<input type="radio" value="男" checked="checked" name="sex" />男    <input type="radio" value="女" name="sex"  checked="checked"/>女<br />
   
    复选框:<input type="checkbox" value="1"  name="cc"/>1<input type="checkbox" value="2" checked="checked"  name="cc" />2<input type="checkbox" value="3" checked="checked"  name="cc" />3<br />   
   
    下拉框:
    <select id="sel" style="width: 100px">
        <option value="yi">1</option>
        <option value="er" selected="selected">2</option>
        <option value="san">3</option>
    </select>

    <script language="javascript" type="text/javascript">
        /*------------------------------------------------javascript-------------------------------------------*/
        /* 获取文本框的值
          alert(document.getElementById("txt").value);
        */
       
        /*获取单选按钮的值
            var radios = document.getElementsByName("sex");
            var n = radios.length;
            for (var i = 0; i < n; i++) {
            if (radios[i].checked) {
            alert(radios[i].value);
            }
        }
        */

        /*获取复选框中选中的值的组合 1,2,3,4
            var checkboxs = document.getElementsByName("cc");
            var n = checkboxs.length;
            for (var i = 0; i < n; i++) {
                if (checkboxs[i].checked) {
                    alert(checkboxs[i].value);
                }
            }
        */

        /*获取下拉列表的选中项的值
            方法一:
                alert(document.getElementById("sel").value);
           
            方法二:
                var sel = document.getElementById("sel");
                alert(sel.options[sel.selectedIndex].value);
        */

        /*------------------------------------------------jquery-------------------------------------------*/
       
        /*获取文本框的值
            alert($("#txt").val());  
        */

        /*获取单选框选中项的值
            alert($(":radio[name='sex']:checked").val());  
            单选框赋值 设置选中项
            $(":radio[name='sex']").val(["男"]);
        */
           
        /*获取复选框的值
            $(":checkbox[name='cc']:checked").each(function(i) {
                alert(this.value);
            });           
            复选框赋值 选中这几项
            $(":checkbox[name='cc']").val(["1", "2", "3"]);
        */       

        /*获取下拉列表的值
            alert($("#sel").val());     
            获取下拉列表的文本
            alert($("#sel option:selected").text()); 
        */ 
    </script>

    </form>
</body>
</html>

posted @ 2010-07-27 10:11  奋斗中...  阅读(328)  评论(0编辑  收藏  举报