`
wolfmaster
  • 浏览: 159096 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

js操作checkbox radio的方法

    博客分类:
  • js
J# 
阅读更多
/*
* 根据分割符号 把值赋给 相应的CheckBox
* CheckBox名字
* 将要分割的值
* 分割符号
*/
function InitiCheckBox(chbName,strValue,strSplit)
{
  var arrChb = document.getElementsByName(chbName);
  if(strValue.indexOf(strSplit) > -1)
  {
      var arrValue = strValue.split(strSplit);
      for(var j = 0; j < arrValue.length; j++)
      {
         for(var i = 0;i < arrChb.length;i++)
         {
            if(arrChb[i].value == arrValue[j])
            {
              arrChb[i].checked = true;
              break;
            }
         }
      }
  }
  else
  {
     for(var i = 0;i < arrChb.length;i++)
     {
        if(arrChb[i].value == strValue)
        {
          
          arrChb[i].checked = true;
          break;
        }
     }
  }
}

function getCheckBoxValue(chbName)
{
  var strTemp = "";
   var cbx = document.getElementsByName(chbName);
  for(var i=0; i < cbx.length; i++)
  {
    if(cbx[i].checked == true)
    {
      strTemp += cbx[i].value +"|";
    }
  }
  if(strTemp != "")
  {
    strTemp = strTemp.substr(0,strTemp.length-1);
  }
  return strTemp;
}
/*
* 是否 有CheckBox 被选择
*/
function isCheckBoxSelected(name)
{
  var t = false;
  var cbx = document.getElementsByName(name);
  for(var i=0; i < cbx.length; i++)
  {
    if(cbx[i].checked == true)
    {
      t = true;
      break;
    }
  }
  return t;
}
/*
* 不选CheckBox
*/
function unALLCheckBoxSelected(name)
{
  var cbx = document.getElementsByName(name);
  for(var i=0; i < cbx.length; i++)
     cbx[i].checked = false
}
/*
* 是否 有CheckBox 被选择
*/
function SelectedCheckBox(name,bSelect)
{
  var cbx = document.getElementsByName(name);
  for(var i=0; i < cbx.length; i++)
  { 
     if(cbx[i].disabled == false)
       cbx[i].checked = bSelect;
  }
}
/*
* 得到Select类型的Text 是否为空
*
*/
function getSelectText(id)
{
  var obj = document.getElementById(id);
  var temp = '';
  temp = obj.options[obj.selectedIndex].text;
  return temp;
}
function InitiSelect(obj,strValue)
{
  for(var i = 0; i < obj.options.length; i ++)
  {
    if(obj.options[i].value == strValue)
    {
      obj.options[i].selected = true;
      break;
    }
  }
}




function getRadioValueByName(name)
{
  var rvs = document.getElementsByName(name);
  var strETD = "";
  for(var i=0; i < rvs.length; i++)
  {
    if(rvs[i].checked == true)
    {
      strETD = rvs[i].value;
      break;
    }
  }
  return strETD;
}
function InitiRadioByName(name,strValue)
{
  var arrRadio = document.getElementsByName(name); 
  for(var i = 0; i < arrRadio.length; i ++)
  {
    if(arrRadio[i].value == strValue)
    {
      arrRadio[i].checked = true;
      break;
    }
  }
}
function noSelectRadioByName(name)
{
  var arrRadio = document.getElementsByName(name); 
  for(var i = 0; i < arrRadio.length; i ++)
      arrRadio[i].checked = false;
}
function getLinkStrBySplitCode(arr,splitCode)
{  
    var strTemp = "";
    if(arr && arr.length == 1)
       strTemp = arr[0];
    else if(arr && arr.length>1){
      for(var i = 0; i < arr.length; i++)
         strTemp += arr[i]+splitCode;
         strTemp =   strTemp.substr(0,strTemp.length-1);
         }
    return strTemp;
}

分享到:
评论

相关推荐

    JQuery操作checkbox、radio等示例

    5. **遍历所有元素**:如果需要对一组checkbox或radio进行操作,可以使用`.each()`方法。`$("[type=checkbox]").each(function() { ... })`会遍历所有的checkbox,并对每个元素执行提供的函数。 6. **获取选中的值*...

    checkbox与radio好看的样式

    在网页设计中,`checkbox` 和 `radio` 是两种常见的表单元素,用于用户进行多选和单选操作。为了提升用户体验和界面美观性,设计师和开发者常常会为这些元素定制自定义样式。本篇文章将深入探讨如何实现“好看的”`...

    漂亮的Checkbox Radio漂亮样式

    在网页设计中,Checkbox(复选框)和Radio(单选按钮)是常见的用户界面元素,用于收集用户的选择信息。这些元素的外观和交互性对于提升用户体验至关重要。"漂亮的Checkbox Radio漂亮样式"这个主题,主要关注如何...

    修改xloadtree 支持checkbox radio 鼠标右键菜单

    "修改xloadtree支持checkbox radio鼠标右键菜单"这个主题涉及到的是对一个特定的JavaScript组件——xLoadTree的增强,使其具备更多功能,提升用户体验。下面将详细阐述这个主题所涵盖的知识点。 1. **xLoadTree**:...

    js实现checkbox的radio单选效果,且可取消选择

    js实现checkbox的radio单选效果,且可取消选择

    checkbox和radio 的使用 特效

    - **JavaScript操作**:可以使用JavaScript改变`checkbox`的状态,例如`document.getElementById('checkboxId').checked = true;` 2. **Radio(单选按钮)** - **定义**:`radio`用于让用户在多个互斥的选项中...

    js checkbox radio

    JavaScript中的`checkbox`和`radio`提供了丰富的用户交互,允许用户进行多选或单选操作。通过JavaScript,我们可以轻松地获取和改变它们的状态,添加事件监听器,以及进行表单验证。熟练掌握这些技巧,将有助于创建...

    jquery操作Radio、Checkbox、Select Demo

    这些是jQuery对Radio、Checkbox和Select基本的操作方式。在实际应用中,你可能还需要结合DOM遍历、事件冒泡等知识,实现更复杂的交互功能。提供的Demo文件应该包含了这些操作的实例代码,通过查看和实践,可以加深...

    JQuery 自定义 radio与checkbox

    jQuery提供了丰富的事件处理函数,如`.click()`, `.change()`, `.focus()`等,可以监听用户对radio和checkbox的操作。例如,当用户点击一个radio按钮时,可以触发一个事件来更新其他同组radio的样式,确保只有一个被...

    自定义radio&checkbox;样式

    在网页设计中,Radio按钮和Checkbox控件是常见的交互元素,用于用户的选择和确认操作。然而,它们的默认样式往往简单且缺乏个性化。本主题聚焦于如何使用CSS3来自定义Radio和Checkbox的样式,以提升用户体验并增加...

    jQuery美化radio和checkbox

    对于美化radio和checkbox,通常有两种主要方法:自定义CSS和使用jQuery插件。 1. 自定义CSS:jQuery本身并不直接改变元素的外观,但可以通过选择器选中radio和checkbox,然后应用CSS来改变它们的样式。例如,你可以...

    jquery radio checkbox 美化

    使用此类插件,只需引入相关JS和CSS文件,并简单调用插件方法,如`$('input[type="checkbox"]').hCheckbox();`。 四、实现自定义图标 为了进一步提升用户体验,我们可以用图片或图标字体(如Font Awesome)替换...

    10组美化的radio&checkbox

    这些美化的radio和checkbox不仅在视觉上打破了传统的单一形态,还可能在交互反馈上有所创新,例如,选中时的动画效果、颜色变化或者形状变换,以明确告知用户操作状态。 在使用这些美化组件时,开发者需要注意兼容...

    checkbox-radio-select样式自定义

    在前端开发中,`checkbox`、`radio`和`select`是三种常见的表单元素,它们用于用户交互,收集和提交数据。`checkbox`用于多选,`radio`用于单选,而`select`通常用于下拉列表选择。在本项目"checkbox-radio-select...

    js中的radio,checkbox,select例子

    一个小例子,含全选,有注释,学习一下这些表单元素的属性和方法

    xtree+checkbox+radio,xloadtree+checkbox+radio

    这些库常被用来展示层级数据,如组织结构、文件目录或者导航菜单等,提供了丰富的交互功能,如复选框(checkbox)和单选按钮(radio),以增强用户体验。下面我们将详细探讨这两个库以及与`ajax`动态加载相关的知识...

    zTree 3.5 radio/checkbox自定义树形

    **zTree 3.5 Radio/Checkbox 自定义树形组件详解** zTree 是一款基于 jQuery 的强大树形插件,广泛应用于网页中的数据展示、菜单导航等场景。在 zTree 3.5 版本中,它提供了丰富的功能,包括单选(Radio)和复选...

    纯JS打造网页中checkbox和radio的美化效果

    例如,当用户点击一个checkbox或radio时,可以通过JavaScript监听`click`事件,然后更新对应的`LABEL`元素的类,从而改变背景图片的位置,实现选中和未选中的视觉效果。 总结来说,纯JavaScript打造网页中checkbox...

    radio/checkbox默认样式太丑?换个新鲜的样子吧!.zip

    本项目名为"Radio/Checkbox Style",基于JavaScript技术实现,旨在提供一种新的、更加吸引人的radio和checkbox样式。这个开源项目可能包含了CSS、JavaScript或HTML文件,用于创建和管理这些定制的控件。通过下载并...

    使用JQuery封装的Select&Checkbox&Radio脚本-维豪信息技术有限公司内部

    本文将深入探讨如何使用jQuery封装Select、Checkbox和Radio元素,以提高前端开发效率并确保跨浏览器兼容性。 一、jQuery封装Select 在HTML中,`&lt;select&gt;`元素用于创建下拉菜单。在jQuery中,我们可以方便地操作...

Global site tag (gtag.js) - Google Analytics