您的位置:首页 > Web前端 > JavaScript

JS操作select checkbox 及radio控件

2012-01-06 12:53 435 查看
最近经常用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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: