`
and4walker
  • 浏览: 557397 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

关于checkbox跟radio的JS函数!

J# 
阅读更多
java 代码
  1. /**         
  2. * 全选的所有指定名称的checkbox        
  3. *@state 全选的checkbox的状态        
  4. *@name   表格中的所有checkbox的名称        
  5. *@author fangtf        
  6. *@type void        
  7. */          
  8. function selectAll(state,name) {          
  9.     var ids = document.getElementsByName(name);          
  10.     for (var i = 0; i < ids.length; i++)           
  11.     {                 
  12.             ids[i].checked = state;          
  13.     }          
  14. }          
  15.          
  16. /**         
  17. * 全选的所有指定id名称的同名checkbox        
  18. *@state 全选的checkbox的状态        
  19. *@name   表格中的所有checkbox的名称        
  20. *@name   表格中的所有checkbox的id        
  21. *@author fangtf        
  22. *@type void        
  23. */          
  24. function selectAllCheckboxByID(state,name,id) {          
  25.     var ids = document.getElementsByName(name);          
  26.     for (var i = 0; i < ids.length; i++)           
  27.     {                 
  28.             if(ids[i].id == id)          
  29.             {          
  30.                 ids[i].checked = state;          
  31.             }          
  32.                       
  33.     }          
  34. }          
  35.          
  36. /**         
  37. * 全选页面上所有的checkbox        
  38. *@state 全选的checkbox的状态        
  39. *@author fangtf        
  40. *@type void        
  41. */          
  42. function selectAlls(state)           
  43. {          
  44.     var inputs = document.getElementsByTagName("input");          
  45.     for(var i =0;i    
  46.     {          
  47.         if(inputs[i].type == "checkbox")          
  48.         {          
  49.             inputs[i].checked =state;           
  50.         }          
  51.     }          
  52.          
  53. }          
  54.          
  55. /**        
  56. *得到鼠标所单击的行        
  57. *@type Object        
  58. */          
  59. function GetRow(oElem) {          
  60.     while (oElem) {          
  61.         if (oElem.tagName.toLowerCase() == "tr" && oElem.parentElement.tagName.toLowerCase() == "tbody") {          
  62.             return oElem;          
  63.         }          
  64.         if (oElem.tagName.toLowerCase() == "table" || oElem.tagName.toLowerCase() == "th") {          
  65.             return false;          
  66.         }          
  67.         oElemoElem = oElem.parentElement;          
  68.     }          
  69. }          
  70.          
  71. /**         
  72. * 全选当前行的checkbox        
  73. *@state 全选的checkbox的状态        
  74. *@author fangtf        
  75. *@type void        
  76. */          
  77. function selectRowCheckbox(state)          
  78. {          
  79.   var row = GetRow(window.event.srcElement);          
  80.   var cells = row.childNodes;           
  81.   for(var i=0;i    
  82.   {          
  83.       var cell = cells[i].childNodes[0];          
  84.      if(cell.tagName == "INPUT")          
  85.      {          
  86.         cell.checked = state;          
  87.      }          
  88.   }          
  89. }          
  90.          
  91. /**         
  92. *选中指定值的Radio        
  93. *如:有两个radio,        
  94. *第一个的name="ids",value="1"       
  95. *第二个的name="ids",value="2"       
  96. *调用方法selectRadio("ids","1");        
  97. *那么数值为1的Radio将被选中        
  98. *@name radio的名称        
  99. *@value radio的值        
  100. *@author fangtf        
  101. *@type void        
  102. */          
  103. function selectRadio(name,value) {          
  104.     var radioObject = document.getElementsByName(name);          
  105.     if(value === "")          
  106.     {          
  107.         radioObject[0].checked = true;          
  108.         return;          
  109.     }          
  110.     for (var i = 0; i < radioObject.length; i++)           
  111.     {          
  112.         if(radioObject[i].value == value)          
  113.         {          
  114.             radioObject[i].checked = true;          
  115.             break;          
  116.         }          
  117.                   
  118.     }          
  119. }          
  120.          
  121. /**         
  122. *选中指定值的checkbox        
  123. *如:有两个checkbox,        
  124. *第一个的name="ids",value="1"       
  125. *第二个的name="ids",value="2"       
  126. *第三个的name="ids",value="3"       
  127. *调用这个方法selectCheckbox("ids","1,2")那么数值为1,2的checkbox将被选中        
  128. *                        
  129. *@name 要选中的checkbox数组的名称        
  130. *@value 判断时候选中的值        
  131. *@author fangtf        
  132. *@type void        
  133. */          
  134. function selectCheckbox(name,value) {          
  135.     var checkObject = document.getElementsByName(name);          
  136.     var valuevalues = value.split(",");          
  137.     for(var j = 0; j < values.length; j++)          
  138.     {          
  139.         for (var i = 0; i < checkObject.length; i++)           
  140.         {          
  141.             if(checkObject[i].value == values[j])          
  142.             {          
  143.                 checkObject[i].checked = true;          
  144.                 break;          
  145.             }          
  146.         }          
  147.     }          
  148.               
  149. }          
  150.          
  151. /**         
  152. *选中指定值的select        
  153. *如:有一个名称为user的select        
  154. *       
  155. *       
  156. *调用这个方法selectOption("user","0")那么选项为0的选项就被选中        
  157. *                       
  158. *@name  String  select的名称        
  159. *@value String  判断时候选中的值        
  160. *@author fangtf        
  161. *@type void        
  162. */          
  163. function selectOption(name,value)          
  164. {          
  165.     var options = document.getElementsByName(name)[0].options;          
  166.     for (var i = 0; i < options.length; i++)           
  167.     {          
  168.         if(options[i].value === value)          
  169.         {          
  170.             options[i].selected = true;           
  171.             break;          
  172.         }          
  173.     }          
  174.          
  175. }      
分享到:
评论

相关推荐

    jquery实现表单美化特效包括checkbox和radio美化特效插件

    一款非常强大的表单美化插件,点击颜色替换相应的checkbox和radio样式 多个选项来自定义checkbox和radio 8个回调函数支持 6个方法来编程控制 效果详情可参考http://www.xwcms.net/js/bddm/19041.html

    javascript checkbox/radio onchange不能兼容ie8处理办法

    javascript checkbox/radio onchange不能兼容ie8处理办法 在ie8下,checkbox的onchange没能实现触发自定义的函数,如何解决该问题,如下: function forIe(){ if($.browser.msie){ //判断浏览器是否为ie $(input...

    javaScript常用事件

    常用javaScript事件归纳。 常用事件: 1.onclick 鼠标单击事件 通常在下列基本对象中产生: button(按钮对象) checkbox(复选框)或(检查列表框) radio (单选钮) reset buttons(重要按钮) submit ...

    JavaScript语言参考手册

    内含: JavaScript语言参考手册.pdf (主要资源) 另外附上: ...netscape.javascript.JSObject 方法和静态方法 netscape.javascript.JSException 构造函数 netscape.plugin.Plugin 构造函数和方法 索引

    JavaScript中文参考手册

    【下一章】 【索引】 【这是目录】 ---------------------------------------...netscape.javascript.JSObject 方法和静态方法 netscape.javascript.JSException 构造函数 netscape.plugin.Plugin 构造函数和方法

    jQuery formValidator表单验证插件开源了!!含API帮助、源码、示例

    支持所有类型客户端控件的校验 支持jQuery所有的选择器语法...选择的个数支持radio/checkbox/select三种控件 支持2个控件值的比较。目前可以比较字符串和数值型、日期型。 支持服务器端校验。 支持输入格式的校验。

    jQ表单万能验证插件 vf-validate.js

    支持:text,number,email,hidden,password,textarea,select,date,checkbox,radio 等 2.vf-type (必填)验证类型[可多个,用 "|" 进行分割],支持:empty(为空验证),reg(正则匹配),func(函数调用)...

    jQuery详细教程

    如果您的网站包含许多页面,并且您希望您的 jQuery 函数易于维护,那么请把您的 jQuery 函数放到独立的 .js 文件中。 当我们在教程中演示 jQuery 时,会将函数直接添加到 &lt;head&gt; 部分中。不过,把它们放到一个单独的...

    Vue 2.x教程之基础API

    本文主要介绍的是关于Vue 2.x之基础API的相关内容,主要内容如下 模板语法(文本插值、属性绑定、JS表达式、过滤器... 表单输入绑定(text、checkbox、radio、select) 一、模板语法 文本插值 - 使用 `{{ }} / &lt;s

    jquery-1.1.3 效率提高800%

    Safari 2 3575ms 475ms 753% Opera 9.1 3196ms 326ms 980% Average improvement: 867% &lt;br&gt;下表为jQuery1.1.3与常用的一些JS库选择器的对比: Browser Prototype jQuery Mootools Ext Dojo ...

    table点击表头排序

    repair: this._repair,//是否解决checkbox和radio状态恢复bug onBegin: function(){},//排序前执行 onEnd: function(){}//排序后执行 */ //完整的示例 //&lt;!DOCTYPE ...

    pui:PJT的ui系统

    组件布局 Layout字体库 Fonts样式 Style组件 Componentspui.ceng.js _ 弹层pui.table.js _ 表格pui.radio.js _ 单选pui.checkbox.js 复选pui.page.js _ 分页pui.switch.js _ 开关pui.select.js _ 下拉菜单pui.query....

    jQuery 表单验证插件

    jQuery formValidator表单验证插件,它是基于jQuery类库,实现了...选择的个数支持radio/checkbox/select三种控件 支持2个控件值的比较。目前可以比较字符串和数值型。 支持服务器端校验。 支持输入格式的校验。

    jQuery formValidator表单验证插件示例源码

    jQuery formValidator表单验证插件示例源码 ...选择的个数支持radio/checkbox/select三种控件 支持2个控件值的比较。目前可以比较字符串和数值型。 支持服务器端校验。 支持输入格式的校验。

    jQuery formValidator表单验证插件

    jQuery formValidator表单校验插件支持的验证功能: ...选择的个数支持radio/checkbox/select三种控件 支持2个控件值的比较。目前可以比较字符串和数值型。 支持服务器端校验。 支持输入格式的校验。

    JavaScript Table排序 2.0 (更新)

    近来还是那么忙,趁五一更新一下程序吧。... 7,修正ie6/7的radio/checkbox状态恢复bug; 8,增加自定义取值函数。 Table 排序 .odTable { width:500px; border:1px solid #ebebeb; line-height:20px; fo

    ExtJSWeb应用程序开发指南(第2版)

    4.1.7 Ext.form.field.Checkbox复选框和Ext.form.field.Radio单选框 4.1.8 Ext.form.CheckboxGroup和Ext.form.RadioGroup 4.1.9 Ext.form.field.Trigger触发字段 4.1.10 Ext.form.field.Spinner微调字段 4.1.11 ...

    vorm:使用JSON和HTML编写表单,使用相同的API

    涡流 通过JSON,JavaScript对象或HTML生成动态的,有状态的Angular表单,并且仍然与同一个... 默认支持: text , number , textarea , select , radio , checkbox , date等。 动态表格状态 您可以通过所谓的invo

    精通AngularJS part1

    Plunker与jsFiddle10 IDE扩展和插件10 12AngularJS速成10 HelloWorld——AngularJS示例10 双向数据绑定12 AngularJS中的MVC模式12 鸟瞰13 深入作用域15 视图21 模块与依赖注入26 模块26 协作对象27 注册...

    jQuery去掉字符串起始和结尾的空格(多种方法实现)

    去掉字符串起始和结尾的空格。 jQuery 代码: 代码如下: $.trim(” ... $(“#A”).val(“1”) id为A的值就是1了 jQuery中都这样,赋值的时候作为参数传给函数,和单纯的js有区别, 像$(“#A”).html(“1”)$(“#A”).

Global site tag (gtag.js) - Google Analytics