表单选择器案例

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="jquery-1.7.1.min.js" ></script>
		<script type="text/javascript">
//			$(function(){
//				$('#btn').click(function(){
//					alert('===');
//                  获取页面中文本框的值，利用val方法（获取/设置表单元素值）
//                  var tet=$('#userName').val('userName');
//                  alert(tet.val());
//                  $('#userName').val('userName');
//                  var psw=$('#psw').val();
//                  alert(psw);
//                  利用标签选择器获取文本框的值
//                  var txt=$('input:text').val();
//                  alert(txt);
//                  利用表单选择器进行选择
//                  var len=$('input:radio:checked');
//                  alert(len.length);
//                  var len=$('input:radio:checked').val();
//                  alert(len);
//                  利用三目运算符获取单选框的值
//                  var sex=$('input:radio:checked').val()=='男'?'男':'女';
//                  alert(sex);
//                  复选框的选中
//                  这种情况会只选中第一个值
//                  var str=$('input:checkbox:checked').val();
//                  获取复选框的长度
//                  var str=$('input:checkbox:checked').length;
//                  var str1=$('input:checkbox:checked');
//                  alert(str1);
//                  利用for循环实现复选框的选中
//                  var stt=$('input:checkbox');
//                  for(var i=0;i<stt.length;i++){
//                  	if(str>0){
//                  		alert(str1[i].value);
//                  	}	
//                  }
//                  用each方法实现复选框的选中
//                	var str='';
//					$.each(stt, function() {
//						if(this.checked){
//							str+=$(this).val();
//						}
//					});
//					alert(str);
//				})
//			})
            var se=document.getElementById('#search');
            alert(se.selectedIndex);
		</script>
	</head>
	<body>
		<form action="" method="post">
			<label for="userName" >姓名：</label>
			<input type="text" value="min" name="userName" id="userName"/>
			<span id="span1"></span>
			<br />
			<label for="psw">密码：</label>
			<input type="password" value="psw" name="psw" id="psw"/>
			<br />
			<input type="radio" name="rad1" id="rad1" value="男" />
			<label for="rad1">男</label>
			<input type="radio" name="rad2" id="rad2" value="女" />
			<label for="rad2">女</label>
			<br />
			<fieldset>
				<legend>兴趣爱好：</legend>
				<input type="checkbox" value="篮球" />篮球
				<input type="checkbox" value="足球"/>足球
				<input type="checkbox" value="羽毛球"/>羽毛球
				<input type="checkbox" value="游戏"/>游戏
				<input type="checkbox" value="看书"/>看书
			</fieldset>
			<input type="button" value="提交" id="btn"/>
		</form>
	</body>
</html>
猜你喜欢
