`

js操作checkbox,radio,select

    博客分类：
  • JS
 
阅读更多
最近经常用JS操作 select checkbox 及radio 几个简单函数记录如下 以备查用

 

Js代码
function getRadioValue(radioName){  
   
      var obj = document.getElementsByName(radioName);   
      var objLen= obj.length;   
      var i;  
    for (i = 0;i< objLen;i++){  
        if (obj [i].checked==true) {  
         return obj [i].value;   
        }  
      }  
      return "";  
}           
 
 
 
//获取复选框的值  
function getCheckboxValue(radioName){  
  var obj = document.getElementsByName(radioName);   
  var objLen= obj.length;   
  var i;  
  var result="";  
for (i = 0;i<objLen;i++){  
    if (obj [i].checked==true) {  
     result+=obj [i].value+",";   
    }  
  }  
  return result;  
}  
            
//复选框 是否处于 选中状态  
function  CheckboxToChecked(eleName, cValue){  
   
  var obj = document.getElementsByName(eleName);   
   
  var objLen= obj.length;   
  var i;  
  var result="";  
for (i = 0;i<objLen;i++){  
    
    if (obj [i].value==cValue) {  
   
     obj [i].checked=true;  
    }else{  
    obj [i].checked=false;  
    }  
  }  
  return result;  
}      
        
//checkBox至少选中一项  
function chkCheckBoxChs(objNam,txt){   
var obj = document.getElementsByName(objNam);   
var objLen= obj.length;   
var num=0;  
for (i = 0;i< objLen;i++){  
if (obj [i].checked==true) {  
num++;  
}  
}  
if(num==0){  
     alert(txt);      
      return false;  
     }   
    return true;  
} 

function getRadioValue(radioName){

  var obj = document.getElementsByName(radioName);
  var objLen= obj.length;
  var i;
for (i = 0;i< objLen;i++){
if (obj [i].checked==true) {
  return obj [i].value;
}
  }
  return "";
}  



//获取复选框的值
function getCheckboxValue(radioName){
  var obj = document.getElementsByName(radioName);
  var objLen= obj.length;
  var i;
  var result="";
for (i = 0;i<objLen;i++){
if (obj [i].checked==true) {
  result+=obj [i].value+",";
}
  }
  return result;
}
 
//复选框 是否处于 选中状态
function  CheckboxToChecked(eleName, cValue){

  var obj = document.getElementsByName(eleName);

  var objLen= obj.length;
  var i;
  var result="";
for (i = 0;i<objLen;i++){
 
if (obj [i].value==cValue) {

  obj [i].checked=true;
}else{
obj [i].checked=false;
}
  }
  return result;
}
 
//checkBox至少选中一项
function chkCheckBoxChs(objNam,txt){
var obj = document.getElementsByName(objNam);
var objLen= obj.length;
var num=0;
for (i = 0;i< objLen;i++){
if (obj [i].checked==true) {
num++;
}
}
if(num==0){
alert(txt);
  return false;
}
return true;
}




其他 只读的属性的为 readOnly (注意大小写)



Js代码
function toReadOnly(ele ,flag){  
        var obj=document.getElementById(ele);  
        if(obj!=null){  
             if(flag==0){//可读  
                obj.readOnly=false;  
                 obj.style.backgroundColor="white";  
             }else{//只读  
                 obj.readOnly=true;  
                 obj.value="";  
                 obj.style.backgroundColor="#D8D8D8";  
             }  
      }  
    } 



select操作
<html>

<body>
<script>
function test(){
var obj  = document.getElementById("temp");

var value = obj.options[obj.selectedIndex].value;
alert(value);
}


</script>
<form>
<select name="cars" id="temp" onclick="test();">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>

</body>
</html>

js获取select元素的value值和文本的方法





获得选中的对象

var selectobj = document.getElementById("selectId");



获得索引;



var　index = selectobj.selectedIndex;



获得选中的value的值



var value = selectobj.options[index].value



文本的值:



var text = selectobj.options[index].text


分享到：
| window.opener属性与window.open()方法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics