jquery学习对单选按钮和复选按钮的操作

原创 2012年03月31日 15:33:33

 

声明:下面的例子是本人自己写的,使用<script src="<%=basepath %>work/jquery-1.7.1.min.js"></script>

这个版本,例子也许和别人讲的不太一样,但是都经过本人测试!

 

注:在下面的例子中一定要注意=和==的区别,前者赋值,后者判断。

 

<table>
		                     <tr>
		                     <td>
					                        作业标题:<input type="text" id="worktitle" value=""/>    <br>
					                        老师:        <input type="text" id="teacher"  value=""/>    <br>
					         课程名称:<input type="text" id="course"  value="">    <br>
					                     学生姓名:   <select name="student" id="student" >
					                       <option>...请选择</option>
											<option value="volvo">Volvo</option>
											<option value="saab">Saab</option>
											<option value="fiat">Fiat</option>
											<option value="audi">Audi</option>
											</select>
											<br>
											
							学生 性别:<input type="radio" name="sex" value="男" /> 男  
							          <input type="radio" name="sex" value="女" /> 女  
							<br />
							
							球类:<input type="checkbox" name="balls" value="football"/>  足球
										<input type="checkbox" name="balls" value="basketball"/> 篮球 
										<input type="checkbox" name="balls" value="badminton"/> 羽毛球 
										<input type="checkbox" name="balls" value="pingpong"/> 乒乓球 
					                        批改日期:从<input type="text" id="reviewdatefrom"    value="">    <br>
					                        到:<input type="text" id="reviewdateto"    value="">    <br>
					                                    <br>
					                        <input type="button" onclick="querywork()"  value="查询"/>
					                        <br><input type="button" id="radiovv"  onclick="getsexvalue()" value=" 测试sex值">
					                        <br><input type="button" id="ccc"  onclick="getballsvalue()" value=" 测试球类值">
					             </td>
					             </tr>
					         </table>






<script>


/*
//对单选按钮设置默认值--js实现
var rrr=document.getElementsByName("sex");
alert(rrr[0].value);
rrr[0].checked=true;

//获取单选按钮组的值--js实现
function getsexvalue(){
  var seind=-1;
  var value="";
  var radio=document.getElementsByName("sex");
  for(var i=0;i<radio.length;i++){
	if(radio[i].checked==true){
	  value=radio[i].value;
	  seind=i;
	  break;
	}
  }
  if(seind==-1){
	  value=radio[0].value;
  }
  alert(value);
  return value;
} 

*/

///////////////////////////以下是通过jquery操作单选按钮。///////////////////////
/*
//radio-1 数据初始化选择。(通过value的值)
$('[name="sex"]:radio').each(function() { 
   if (this.value == '女') { 
     this.checked = true;
   } 
});
*/

//radio-2 数据初始化选择,也可以通过index来确定那个被选中.
var dan=$('[name="sex"]:radio');
dan[1].checked=true;

/*
//radio-3 直接获取值 
function getsexvalue() {
	var sed=$('[name="sex"]:checked:radio').val();
	alert('获得的单选按钮值为:' + sed); 
}
*/

//radio-4 下面用遍历的方法
/*
function getsexvalue() {
	//var sed=$('[name="sex"]:radio');
	$('[name="sex"]:radio').each(function() { 
		   if (this.checked ==true) { 
		       alert(this.value+"--选中了");
		   }else{
			   alert(this.value+"--没选中");
		   }
	});
}
*/

//radio-5 下面用遍历的方法,判断它的值,并设置它的选中状态
function getsexvalue() {
	//var sed=$('[name="sex"]:radio');
	$('[name="sex"]:radio').each(function() { 
		   if (this.value =='男') { 
		       this.checked =true;
		       alert("设置这个选中--"+this.value);
		   }else{
			   this.checked =false;
			   alert("设置这个未选中--"+this.value);
		   }
	});
}


////////////////////////以下是jquery复选框操作////////////////////

//checkbox-1 设置初始选中值
var chk=$('[name="balls"]:checkbox');
//chk[0].checked=true;
//chk[1].checked=true;

//checkbox-2 下面可以全部设置成选中
chk.attr("checked", true);
/*
//checkbox-3 遍历获取值
function getballsvalue(){
	$('[name="balls"]:checkbox').each(function() { 
		   if (this.checked ==true) { 
		       alert(this.value+"--选中了");
		   }else{
			   alert(this.value+"--没选中");
		   }
	});
}
*/

//checkbox-4 遍历获取值,并根据值来设置其选中状态
function getballsvalue(){
	$('[name="balls"]:checkbox').each(function() { 
		   if (this.value =='football') { 
		       this.checked =true;
		       alert("设置这个选中--"+this.value);
		   }else{
			   this.checked =false;
			   alert("设置这个未选中--"+this.value);
		   }
	});
}

</script>


 

 

 

MFC-复选框单选按钮用法

复选框:判断是否被选中:方法1: 利用CButton类获取指向复选框按钮的指针,然后来操作它//获取指向复选框按钮的指针 CButton* pBtn = (CButton*)GetDlgIt...
  • qq_18297675
  • qq_18297675
  • 2016年03月25日 14:09
  • 1293

CSS3美化单选按钮和复选按钮

1.html CSS3美化单选按钮和复选按钮代码 .demo{width:360px;margin:50px auto 10px auto;padding:10px;} .demo ...
  • gao_xu_520
  • gao_xu_520
  • 2017年07月13日 09:39
  • 300

(亲测) 带有单选按钮和复选按钮 的dialog+详细代码+注释

package example.com.myapplication; import android.app.Activity; import android.app.AlertDialog; imp...
  • ITzhongzi
  • ITzhongzi
  • 2016年08月22日 10:03
  • 214

单选按钮和复选按钮

在vc中没有所谓CRadioButton 或CCheckBox之类的类. 通常它们可以转换为CButton*类.   如判断是否选中可以用: ((CButton   *)GetDlgItem(...
  • dyzhen
  • dyzhen
  • 2010年11月23日 14:24
  • 262

JQuery操作单选按钮以及复选按钮

单选按钮以及复选按钮在开发过程中会经常用到,下面我就来通过JQuery操作单选按钮和复选按钮: 单选按钮: 通过JQuery获取单选按钮对象我们总共有三种途径: ①ID:$("#radioId"...
  • zlb824
  • zlb824
  • 2012年03月29日 13:29
  • 1566

JQuery - 设置/获取单选按钮radio/复选按钮checkbox的值

基于JQuery(jquery.min.js)编写设置/获取单选按钮input[type="radio"]/复选按钮input[type="checkbox"]的值 /** * 设置radio...
  • qq502792428
  • qq502792428
  • 2016年01月06日 15:56
  • 1240

下拉列表、单选按钮、复选框常用用法总结

下拉列表html 相等 大于 小于 获取下拉列表的值$("#demoselect").val()//value$("#demoselect")....
  • dora_310
  • dora_310
  • 2017年01月10日 22:01
  • 1097

Android用户界面基础之CheckBox(复选按钮)、RadioButton(单选按钮)学习

CheckBoxCheckBox,复选按钮。扩展自CompoundButton类。具有选中和非选中两种状态。复选按钮在单个使用时与状态按钮功能相近。与状态按钮不同在于复选按钮可以多个同时使用。当使用多...
  • qq_27650777
  • qq_27650777
  • 2016年01月23日 11:44
  • 4234

Jquery 获取单选按钮组选中的值的方法

$("input[@name=radioname][@checked]").val();其中radioname是单选组的name属性的值
  • neubuffer
  • neubuffer
  • 2013年11月23日 14:33
  • 785

单选按钮&复选按钮

复选按钮:需要通过按钮实现 onClick里面设置当checkbox.isChecked()默认为true就是选中状态; xml标签:         android:id="@+id/fu...
  • xxc1358602107
  • xxc1358602107
  • 2016年07月12日 20:31
  • 72
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery学习对单选按钮和复选按钮的操作
举报原因:
原因补充:

(最多只允许输入30个字)