简单对象取值

2015/12/14 39213
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Jquery实现组件取值</title>
<script type="text/javascript">
	function btnclick() {
		//获取文本框的值
		var nameText = document.getElementById("nameText").value;
		alert(nameText);
		//获取密码框的值
		var password=document.getElementById("password").value;
		alert(password);
		//获取单选框的值
		/**
		1，通过元素的名字获取元素列表
		var obj = document.getElementsByName("fruit");
		2，通过标签的名字获取元素列表
		var obj = document.getElementsByTagName("input");
		3，是否选中
		obj[i].checked;
		4，单选框里面的值
		obj[i].value;
		*/
		var sexobj=document.getElementsByName("sexradio");
		for(var i=0;i<sexobj.length;i++){
			if(sexobj[i].checked){
				alert(sexobj[i].value);
			}
		}
		//获取复选框的值
		var hobbyobj=document.getElementsByName("hobby");
		for(var i=0;i<hobbyobj.length;i++){
			if(hobbyobj[i].checked){
				alert(hobbyobj[i].value);
			}
		}
		//获取下拉框的值
		var book=document.getElementById("book");
		for(var i=0;i<book.options.length;i++){
			if(book.options[i].selected){
				alert(book.options[i].value);
			}
		}
	}
</script>
</head>
<body>
    用户<input id="nameText" type="text" name="userText"></br>
    密码<input id="password" type="password" name="password"></br>
  性别 <input id="radio1" type="radio" name="sexradio" value="男">男
     <input id="radio2" type="radio" name="sexradio" value="女">女</br>
     婚否<input id="checkbox" type="checkbox" name="merry"></br>
   爱好<input id="hobby1" type="checkbox" name="hobby" value="football">足球
    <input id="hobby2" type="checkbox" name="hobby" value="basketball">篮球
    <input id="hobby3" type="checkbox" name="hobby" value="pingpang">乒乓球</br>
     
   喜欢的水果<select id="fruit" name="fruit">
        <option value="choose">请选择喜欢的水果</option>
        <option value="apple">苹果</option>
        <option value="pear">梨</option>
   		<option value="banana">香蕉</option>
       </select> </br>
  喜欢的书籍 <select id="book" name="book" multiple="multiple">
        <option value="0" selected="selected">请选择喜欢的书籍</option>
        <option value="1">苹果</option>
        <option value="2">梨</option>
   		<option value="3">香蕉</option>
       </select></br>
       <input id="basebut" type="button" value="提交" onclick="btnclick()">
</form>
</body>
</html>
代码片段
