• JS获取表单元素的value


    <!--
    1.option
    selected属性,如果我们在下拉列表里面选择了一个option那么他的selected="true" ,如果我们想设置当前的option是选中 状态的,那么我们只要设置
    它的selected=‘true’或者selected="selected"或者selected,这几种方式设置都可以,但是在我们使用jquery或者js获取selected这个属性的值时,
    如果他当前的状态时选中的那么他的属性值就是true
    2.checkedbox,radio
    checked属性只要我们设置了checked属性那么他的值就是true其实这几个属性的设置方法都是一样的,如checked="checked",或者
    checked="true"或者checked这几种设置方法都可以设置这个当前的checkbox为选中状态
    -->
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html> 
    <head> 
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <title>##</title> 
    <style type="text/css"> 
    </style> 
    </head> 
    <body>
    文本域:
        <input type="text" name="userName" id="userName" value="默认值"/><br/>
    
    单选框:
        <input type="radio" name="sex" value="woman"/><input type="radio" name="sex" value="man"><br/>
    
    复选框:
        <input type="checkbox" name="hobby" value="1">1
        <input type="checkbox" name="hobby" value="2">2
        <input type="checkbox" name="hobby" value="3">3<br/>
    下拉菜单:
        <select name="hobby" id="hobby">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </seclect><br/>
    提交不同表单元素的值:
        <input type="button" value="获取表单元素的值" onclick="getVal();"/>
    <script type="text/javascript">
    function getVal(){
        var str="";
        //获取文本域的值
        var text=document.getElementById("userName");
        str="文本域:"+text.value+"";
        //获取单选框的值
        var radios=document.getElementsByName("sex");
        for(var i=0;i<radios.length;i++){
            if(radios[i].checked){
                str+="单选框:"+radios[i].value+"";
            }
        }
        //获取复选框的值
        var checkboxs=document.getElementsByName("hobby");
        for(var i=0;i<checkboxs.length;i++){
            if(checkboxs[i].checked){
                str+="复选框:"+checkboxs[i].value+"";
            }
        }
        //获取下拉菜单的值
        //方法一:
        var selects=document.getElementById("hobby")
        str+="下拉菜单:"+selects.value+"";
        //方法二:
        str+="下拉菜单:"+selects.options[selects.selectedIndex].value;
        console.log(str);
        
        alert(str)
    }
    </script>
    </body> 
    </html> 
  • 相关阅读:
    批处理中的符号
    IF命令详解
    批处理介绍
    批处理中的变量
    单调栈2289. 使数组按非递减顺序排列
    01BFS2290. 到达角落需要移除障碍物的最小数目
    电脑FQ成功后,命令行无法FQ
    d365 webresource 批量更新
    asp.net mvc传值方式
    SpringBoot整合Nacos实现动态配置数据源
  • 原文地址:https://www.cnblogs.com/angelye/p/7481415.html
Copyright © 2020-2023  润新知