js method to obtain radio and select attributes-PHP Tutorial-php.cn

js method to obtain radio and select attributes

WBOY

Release： 2016-07-25 09:12:42

Original

1462 people have browsed it

Implement a linkage menu with the following goals: 1. Click "Anonymous Group" and automatically jump to: Member Type "Private Group", Access Control "Group Members" 2. Click "Public Group" and automatically jump to: Member type "Real-name Group" As shown below: js radio与select属性 First, get the event of clicking the radio, using the jquery library. After getting the event, determine which radio it is. By judging which radio is checked, the linkage transformation is performed. The problems encountered include compatibility with IE and Firefox events, and then setting the selected attribute of options in select.

Compatible with IE and Firefox, use var ie=document.all;var nn6=document.getElementById&&!document.all; To set the selected attribute of options in select, use var t=document.getElementsByName("select1")[0][1]; t.setAttribute("selected","selected"); When setting the selected attribute, document.getElementsByName("select1").options is usually used, but Firefox reports undefined. So after traversing, I used an array to solve it.

Example, complete code that achieves goal 1:

Member type:
Real name Group (use name)
Anonymous group (use nickname)
Group Type:
Public group
Private group
Access control:
// JavaScript Document
var ie=document.all;
var nn6=document.getElementById&&!document.all;
$(document).ready(function(){
$(":radio").click(function(e){
var $name=(nn6?e.target.name:event.srcElement.name);
if($name == "member_type")
{
if(1 == GetRadioValue($name))
{
SetRadioCheck ("search_type",1);
var t=document.getElementsByName("select1")[0][1];
t.setAttribute("selected","selected");
}
}
});
});

Copy the code

When achieving goal 2, I encountered that setAttribute in SetRadioCheck was not working. After debugging, I didn’t know why, so I changed obj.checked = true; Implement functions 1 and 2 js

// JavaScript Document
var ie=document.all;
var nn6=document.getElementById&&!document.all;
$(document).ready(function(){
/*Click "Anonymous Group" , automatic jump: member type "private group", access control "group members"*/
$(":radio").click(function(e){
var $name=(nn6?e.target.name: event.srcElement.name);
if($name == "member_type")
{
if(1 == GetRadioValue($name))
{
SetRadioCheck("search_type",1);
var t=document. getElementsByName("select1")[0][1];
t.setAttribute("selected","selected");
}
}
/*Click "Public Group" and automatically jump to: Member type "Real-name Group" */
if($name == "search_type")
{
if(1 == GetRadioValue($name))
{
SetRadioCheck("member_type",0);
}
}
});
}) ;
/*Get the value of the checked radio
*RadioName: the name of the radio group to get the radio value
*/
function GetRadioValue(RadioName){
var obj;
obj=document.getElementsByName(RadioName);
if( obj!=null){
var i;
for(i=0;i
if(obj[i].checked){
return obj[i].value;
}
}
}
return null;
}
/*Set the selected attribute
*RadioName: To modify the name of the attribute radio group
*i: The i-th element in the radio is selected
*/
function SetRadioCheck(RadioName,i){
var obj;
obj=document.getElementsByName(RadioName);
//obj[i].setAttribute("checked","checked");
obj[i].checked = true;
}

Copy code

For the second call to SetRadioCheck

if($name == "search_type")
{
if(1 == GetRadioValue($name))
{
SetRadioCheck("member_type",0);
}
}
obj[i ].setAttribute("checked", "checked") is invalid, please give me some advice.

Copy code