Code for js to obtain and control radio and select attributes

Source: Internet
Author: User

Goals: 1. Click "anonymous group" to automatically jump to the "private group" and "Access Control" group member "of the member type"
2. Click "public group" to automatically jump to: member type "real-name group"

  

The first is to obtain the click radio event. The jquery library is used to determine the radio after the event is obtained. Then, the radio is checked and then the linkage transformation is performed. The problems encountered are: the events compatible with ie and firefox, and then the selected Attribute of options in select.

Compatible with ie and firefox, var ie = document. all; var nn6 = document. getElementById &! is used &&! Document. all;

Set the selected Attribute of options in select to 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. Then, an array is used to solve the problem.

The complete code for achieving objective 1 is as follows:
Html

Copy codeThe Code is as follows: <script type = "text/javascript" src = "jquery. js"> </script>
<Script type = "text/javascript" src = "l. js"> </script>
<P> <label> member type: </label>
<Input type = "radio" name = "member_type" checked = "checked" value = '0'/> real-name group (name used)
<Input type = "radio" name = "member_type" value = '1'/> anonymous group (nickname used)
</P>
<P> <label> group type: </label>
<Input type = "radio" name = "search_type" checked = "checked" value = '1'/> Public group
<Input type = "radio" name = "search_type" value = '0'/> private group
</P>
<P> <label> Access Control: </label>
<Select class = "select1" name = "select1">
<Option value = "0"> anyone </option>
<Option value = "1"> group member </option>
</Select>
</P>

JsCopy codeThe Code is as follows: // JavaScript Document
Var ie = document. all;
Var nn6 = document. getElementById &&! Document. all;
$ (Document). ready (function (){
$ (": Radio"). click (function (e ){
Var $ name = (nn6? E.tar get. 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 ");
}
}
});
});

When achieving objective 2, The setAttribute in SetRadioCheck is difficult to enable. If debugging is completed, I do not know why, so I changed obj [I]. checked = true;
Implement functions 1 and 2 jsCopy codeThe Code is as follows: // JavaScript Document
Var ie = document. all;
Var nn6 = document. getElementById &&! Document. all;
$ (Document). ready (function (){
/* Click "anonymous group" to automatically jump to: member type "private group", access control "group member "*/
$ (": Radio"). click (function (e ){
Var $ name = (nn6? E.tar get. 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" to automatically jump to: member type "real-name group "*/
If ($ name = "search_type ")
{
If (1 = GetRadioValue ($ name ))
{
SetRadioCheck ("member_type", 0 );
}
}
});
});
/* Obtain the radio value to be checked.
* RadioName: name of the radio Group to obtain the radio Value
*/
Function GetRadioValue (RadioName ){
Var obj;
Obj = document. getElementsByName (RadioName );
If (obj! = Null ){
Var I;
For (I = 0; I <obj. length; I ++ ){
If (obj [I]. checked ){
Return obj [I]. value;
}
}
}
Return null;
}
/* Set the selected Attribute
* RadioName: name of the property radio group to be modified
* I: the I-th element in radio is selected.
*/
Function SetRadioCheck (RadioName, I ){
Var obj;
Obj = document. getElementsByName (RadioName );
// Obj [I]. setAttribute ("checked", "checked ");
Obj [I]. checked = true;
}

For the second call of SetRadioCheckCopy codeThe Code is as follows: if ($ name = "search_type ")
{
If (1 = GetRadioValue ($ name ))
{
SetRadioCheck ("member_type", 0 );
}
}
Obj [I]. setAttribute ("checked", "checked") is invalid. Please advise.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.