js 获取表单数据

最新推荐文章于 2024-04-25 20:22:26 发布

俊刚、

最新推荐文章于 2024-04-25 20:22:26 发布

阅读量2.9w

点赞数 10

分类专栏： 2020以前文章标签： html 表单数据

本文链接：https://blog.csdn.net/csdn9_14/article/details/53067533

版权

2020以前专栏收录该内容

50 篇文章 0 订阅

订阅专栏

js获取表单数据：

html代码：

<span style="font-size:18px;"><!DOCTYPE html>
<html>
<meta charset="utf-8" />
<head>

 </head>
 <body>  
   <form action="result.jsp" id="form1" method="post" name="form1" >  
     username : <input type="text"   id="username" name="username"  value="张三" /><br><br />
     password : <input type="password"   id="password" name="pawd"  value="123" /><br><br />
     sex : <input type="radio" name="sex" value="男" checked  />男
    <input type="radio"  name="sex"  value="女" />女<br><br />
     addr : <select id="addr" name="province">
                    <option value="北京">北京</option>
                    <option value="上海">上海</option>
                    <option value="广州">广州</option>
                    <option value="深圳">深圳</option>
                 </select><br><br />
     fruits : <input type="checkbox" name="fruits" value="Banana" />香蕉
    <input type="checkbox" name="fruits" value="Apple" />苹果
    <input type="checkbox" name="fruits" value="Orange" />橘子
    <input type="checkbox" name="fruits" value="Watermelon" />西瓜 <br /><br />
    <input type="button" value = "提交" οnclick="getForm()">
     </form>  
 </body>  
</html> </span>

javascript代码：

<script type="text/javascript">  

 function getForm()  
 {  
    var form = document.getElementById("form1");   //获取id为“form1”表单中所有的属性的数据  
    var content = form.elements(0).value;   //获取form表单中第一个元素的值
    alert("姓名:"+content); //就是username的值  
      
    var pass = document.getElementById("password").value;   //直接通过元素的属性Id来直接获取  
    alert("password : " + pass);  
    
    var sex = document.getElementsByName('sex'); //通过元素属性name获取sex的值
    for(var i = 0; i < sex.length; i++)
    {
        if(sex[i].checked)
        alert("性别："+sex[i].value);
    }
        
    var addr = document.getElementById("addr").value;  //直接通过元素的属性Id来直接获取选择下拉菜单的值
    alert("来自"+addr);
    
    var fruits = document.getElementsByName("fruits"); //通过元素属性name获得所有name="fruits"的值
    var str ="";
    for(var j=0; j<fruits.length;j++)
    {
        if(fruits[j].checked)
        str += fruits[j].value+",";
     }
    alert("你选择的食物是："+str);
 }

 </script>

俊刚、

关注

10
点赞
踩
28

收藏

觉得还不错? 一键收藏
打赏
0
评论
js 获取表单数据

function getForm() { var form = document.getElementById("form1"); //获取id为“form1”表单中所有的属性的数据 var content = form.elements(0).value; //获取form表单中第一个元素的值 alert("姓名:"+content); //就是us
复制链接

扫一扫