js 获取表单数据
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 = "提交" onclick="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> 声明：该文观点仅代表作者本人，牛骨文系教育信息发布平台，牛骨文仅提供信息存储空间服务。
