js获取radio与select属性的方法

实现一个联动菜单，目标： 1、点击“匿名小组”，自动跳转：成员类型“私密群”、访问控制 “群成员” 2、点击“公开群”， 自动跳转：成员类型“实名小组” 如下图： 　　 首先，获得点击radio的事件，用的是jquery库，获得事件后判断是那个radio，通过判断是那个radio被checked了然后进行联动变换。 其中遇到的问题有，兼容ie和firefox的事件，然后是设置select中的中options的selected属性。

兼容ie和firefox用了var ie=document.all;var nn6=document.getElementById&&!document.all; 设置select中的中options的selected属性用的是var t=document.getElementsByName("select1")[0][1]; t.setAttribute("selected","selected"); 在设置selected属性通常用的是document.getElementsByName("select1").options,但是firefox报undefined。于是遍历后就用了一个数组解决了。

例子，实现了目标1的完整代码：

4. 成员类型:

5. 实名小组(使用姓名)
6. 匿名小组(使用昵称)

8. 群组类型:

9. 公开群
10. 私密群

12. 访问控制:

13. 任何人
    群成员
15. // JavaScript Document
16. var ie=document.all;
17. var nn6=document.getElementById&&!document.all;
18. $(document).ready(function(){
19. $(":radio").click(function(e){
20. var $name=(nn6?e.target.name:event.srcElement.name);
21. if($name == "member_type")
22. {
23. if(1 == GetRadioValue($name))
24. {
25. SetRadioCheck("search_type",1);
26. var t=document.getElementsByName("select1")[0][1];
27. t.setAttribute("selected","selected");
28. }
29. }
30. });
31. });

复制代码

实现目标2时，遇到了SetRadioCheck中的setAttribute不好使了，调试了也不知道什么原因于是换了obj.checked = true; 实现功能1、2 js

2. // JavaScript Document
3. var ie=document.all;
4. var nn6=document.getElementById&&!document.all;
5. $(document).ready(function(){
6. /*点击"匿名小组"，自动跳转：成员类型"私密群"、访问控制 "群成员"*/
7. $(":radio").click(function(e){
8. var $name=(nn6?e.target.name:event.srcElement.name);
9. if($name == "member_type")
10. {
11. if(1 == GetRadioValue($name))
12. {
13. SetRadioCheck("search_type",1);
14. var t=document.getElementsByName("select1")[0][1];
15. t.setAttribute("selected","selected");
16. }
17. }
18. /*点击"公开群"， 自动跳转：成员类型"实名小组"*/
19. if($name == "search_type")
20. {
21. if(1 == GetRadioValue($name))
22. {
23. SetRadioCheck("member_type",0);
24. }
25. }
26. });
27. });
28. /*获得被check的radio的值
29. *RadioName：要获得radio值的radio组名称
30. */
31. function GetRadioValue(RadioName){
32. var obj;
33. obj=document.getElementsByName(RadioName);
34. if(obj!=null){
35. var i;
36. for(i=0;iif(obj[i].checked){
37. return obj[i].value;
38. }
39. }
40. }
41. return null;
42. }
43. /*设置被选中属性
44. *RadioName:要修改属性radio组的名称
45. *i:radio中第i个元素被选中
46. */
47. function SetRadioCheck(RadioName,i){
48. var obj;
49. obj=document.getElementsByName(RadioName);
50. //obj[i].setAttribute("checked","checked");
51. obj[i].checked = true;
52. }

复制代码

对于在第二次调用SetRadioCheck

2. if($name == "search_type")
3. {
4. if(1 == GetRadioValue($name))
5. {
6. SetRadioCheck("member_type",0);
7. }
8. }
9. obj[i].setAttribute("checked","checked")的失效，还请指教。

复制代码