js to obtain the drop-down list to select the value and text (select), as well as access to radio buttons (radio) group and modify the selected value of

Mar 7 posted in AJAX (RSS), comments.

Advertisements

First, access the drop-down list to select the value and text (select)

<html>
<head><title>Gets the drop-down list to select key values, and text (select)</title></head>
<body>
<script>

//Gets the drop-down list to select key text 
function getSelectedText(name){
var obj=document.getElementById(name);
for(i=0;i<obj.length;i++){
   if(obj[i].selected==true){
    return obj[i].innerText;      //The key is by option object the InnerText property gets the option text 
   }
}
}

//Gets the drop-down list to select key value 
function getSelectedValue(name){
var obj=document.getElementById(name);
return obj.value;      //So simple, the direct use of the object's value property to get to the 
}

</script>
<select>
<option value="fist">1</option>
<option value="second">2</option>
<option value="third">3</option>
</select>

<input type="button"   value="The selected text "   />
<input type="button"   value="The selected value " />
</body>
</html>

Second, access to radio buttons (radio) group and modify the selected value of

To see a lot of posts said js access the radio button (radio) group can be directly used the value of document.getElementById ( "oper"). Value, although the radio button group with the same drop-down list (list item is an array) is also an array in this way can be of value to the drop-down list, but the radio button group that they were less than the selected value. Under carefully studied, summarized as follows:

With different drop-down list, radio button or this.form.oper have to use document.getElementsByName ( 'oper') access to the array object, document.getElementById ( 'oper') Can not access to the array object (select can). But also to obtain the value of one cycle have to judge through acquisition, should not directly. Value (select can). And to change the radio button group to select items, but also have to change with each cycle of the radio button to determine the value.

Radio.html test code is as follows:

<html>
<head></head>
<script language="javascript">

//For the radio button's value for a single option and more options. Not selected return false; selecting the item and returns the value of an option. 
function getRadio(oRadio){
var oRadioLength= oRadio.length;
var oRadioValue = false;
//alert("oRadioLength:["+oRadioLength+"]");

if (oRadioLength== undefined){
      if (oRadio.checked){
       oRadioValue = oRadio.value;
      }
}else{
      for (i=0;i<oRadioLength;i++){
       //alert("oRadio["+i+"]:"+oRadio[i].checked+"/"+oRadio[i].value);
       if (oRadio[i].checked){
        oRadioValue = oRadio[i].value;
        break;
       }
      }
}
return oRadioValue;
}


//Improvement: 

//For the radio button's value, pass the name as a parameter to the radio. Not selected return false; selecting the item and returns the value of an option. 
function getRadioValue(name){
var radioes = document.getElementsByName(name); 
for(var i=0;i<radioes.length;i++)
{
     if(radioes[i].checked){
      return radioes[i].value;
     }
}
return false;
}


//By value, modify the selected radio button 
function changeRadio(oRadio,oRadioValue){        //Passing in an object 
for(var i=0;i<oRadio.length;i++) //Loop 
{
        if(oRadio[i].value==oRadioValue) //To compare values 
        { 
         oRadio[i].checked=true; //Modify the selected 
         break; //Stop the loop 
        }
}
}
  

//Improvement: 

//By value, modify the selected radio button 
function setRadio(name,sRadioValue){        //Incoming radio of name and value of the selected item 
var oRadio = document.getElementsByName(name); 
for(var i=0;i<oRadio.length;i++) //Loop 
{
        if(oRadio[i].value==sRadioValue) //To compare values 
        { 
         oRadio[i].checked=true; //Modify the selected 
         break; //Stop the loop 
        }
}
}

</script>

<body>
<form name="frm">

<input type="radio" name="oper" value="agree"        >Agree with </td>
<input type="radio" name="oper" value="downchange" checked>Under modify </td>
<input type="radio" name="oper" value="refuse">Declined </td>
<input type="radio" name="oper" value="report" >Escalation </td>
<br>
alert('result:'+getRadio(this.form.oper))
<input type="button" name="test1" value="Button 1 ">       
<br>
alert('result:'+getRadio(document.getElementById('oper')))
<input type="button" name="test2" value="Button 2 ">
<br>
alert(this.form.oper.value)
<input type="button" name="test3" value="Button 3 ">
<br>
changeRadio(this.form.oper,"Escalation ")
<input type="button" name="test4" value="Button 4 ">  
<br><br><br><br>    


<select>
<option value="agree" >Agree with </option>
<option        value="downchange" selected>Under modify </option>
<option value="refuse">Declined </option>
<option        value="report">Escalation </option>
</select>
<br>
alert(this.form.slt.value)
<input type="button" name="test5" value="Button 5 ">
<br>
document.getElementById('slt')[2].innerText)
<input type="button" name="test6" value="Button 6 ""alert(document.getElementById('slt')[2].innerText);">


</form>
</body>
</html>

Reprint Address: http://hi.baidu.com/nirvanan/blog/item/5b841539aa872af5b311c7c2.html