Jquery判断radio、selelct、checkbox是否选中及获取选中值方法总结

前端技术 2023/09/03 JavaScript

jquery取radio单选按钮的值 

复制代码 代码如下:

$(\"input[name=\'items\']:checked\").val(); 

另：判断radio是否选中并取得选中的值 
 
如下所示：
复制代码 代码如下:

function checkradio(){
var item = $(\":radio:checked\");
var len=item.length;
if(len>0){
  alert(\"yes--选中的值为：\"+$(\":radio:checked\").val());
}
}

 
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关   
 
获取一组radio被选中项的值  
复制代码 代码如下:

 var item = $(\'input[name=items][checked]\').val();  

 获取select被选中项的文本  
复制代码 代码如下:

 var item = $(\"select[name=items] option[selected]\").text();  

 select下拉框的第二个元素为当前选中值  
复制代码 代码如下:

 $(\'#select_id\')[0].selectedIndex = 1;  

 radio单选组的第二个元素为当前选中值  
复制代码 代码如下:

 $(\'input[name=items]\').get(1).checked = true; 

    
获取值： 

文本框，文本区域：$(\"#txt\").attr(\"value\")；  
多选框checkbox：$(\"#checkbox_id\").attr(\"value\")；  
单选组radio： $(\"input[type=radio][checked]\").val();  
下拉框select： $(\'#sel\').val(); 

控制表单元素：   
 
文本框，文本区域：$(\"#txt\").attr(\"value\",\'\');//清空内容  

复制代码 代码如下:

$(\"#txt\").attr(\"value\",\'11\');//填充内容 

   
多选框checkbox： $(\"#chk1\").attr(\"checked\",\'\');//不打勾  
复制代码 代码如下:

 $(\"#chk2\").attr(\"checked\",true);//打勾  
 if($(\"#chk1\").attr(\'checked\')==undefined) //判断是否已经打勾 

单选组radio： $(\"input[type=radio]\").attr(\"checked\",\'2\');//设置value=2的项目为当前选中项  
 
下拉框select： $(\"#sel\").attr(\"value\",\'-sel3\');//设置value=-sel3的项目为当前选中项  

复制代码 代码如下:

$(\"<option value=\'1\'>1111</option><option value=\'2\'>2222</option>\").appendTo(\"#sel\")//添加下拉框的option  
$(\"#sel\").empty()；//清空下拉框 

    
刚开始接触jquery，很多东西不熟悉  
 
在用$(\"#id\")来获得页面的input元素的时候，发现$(\"#id\").value不能取到值 

后来终于在伟大的百度帮助下，找到了问题的原因：  
 
$(\"\")是一个jquery对象，而不是一个dom element 
 
value是dom element的属性 

jquery与之对应的是val 
 
val() :获得第一个匹配元素的当前值。 
 
val(val):设置每一个匹配元素的值。 

所以，代码应该这样写： 
 
   
取值：val = $(\"#id\")[0].value;  
赋值：  $(\"#id\")[0].value = \"new value\";  
或者$(\"#id\").val(\"new value\"); 
或者这样也可以：val = $(\"#id\").attr(\"value\");
 

jQuery中each非常好用，常用它取代javascript的for循环
 
例如在一个function里有一个each,在each里某种条件 成立的话，就把这个function返回true或者false

复制代码 代码如下:

function methodone(){
....
$.each(array,function(){
if(条件成立){
return true;
}
});
....
}

结果发现老是不对。
 
后来查找资料才发现,在each代码块内不能使用break和continue,要实现break和continue的功能的话，要使用其它的方式
break----用return false;
continue --用return ture;
 
所以当我在each里想使用return true给这个function返回时，其实只是让each继续执行而以
连each都没有中断，所以function也就不能return了 
 
另：判断radio是否选中并取得选中的值
 
如下所示：
复制代码 代码如下:

function checkradio(){
var item = $(\":radio:checked\");
var len=item.length;
if(len>0){
  alert(\"yes--选中的值为：\"+$(\":radio:checked\").val());
}
}

本文地址：https://www.stayed.cn/item/8232

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案