`

JS对表单控件check,select,radio赋选中值

 
阅读更多

 


JS对表单控件check,select,radio赋选中值

/** 
* 全选的所有指定名称的checkbox 
*@state 全选的checkbox的状态 
*@name 表格中的所有checkbox的名称 
*@author fangtf 
*@type void 
*/ 
function selectAll(state,name) { 
var ids = document.getElementsByName(name); 
for (var i = 0; i < ids.length; i++) 

ids[i].checked = state; 



/** 
* 全选的所有指定id名称的同名checkbox 
*@state 全选的checkbox的状态 
*@name 表格中的所有checkbox的名称 
*@name 表格中的所有checkbox的id 
*@author fangtf 
*@type void 
*/ 
function selectAllCheckboxByID(state,name,id) { 
var ids = document.getElementsByName(name); 
for (var i = 0; i < ids.length; i++) 

if(ids[i].id == id) 

ids[i].checked = state; 





/** 
* 全选页面上所有的checkbox 
*@state 全选的checkbox的状态 
*@author fangtf 
*@type void 
*/ 
function selectAlls(state) 

var inputs = document.getElementsByTagName("input"); 
for(var i =0;i<inputs.length;i++) 

if(inputs[i].type == "checkbox") 

inputs[i].checked =state; 





/** 
*得到鼠标所单击的行 
*@type Object 
*/ 
function GetRow(oElem) { 
while (oElem) { 
if (oElem.tagName.toLowerCase() == "tr" && oElem.parentElement.tagName.toLowerCase() == "tbody") { 
return oElem; 

if (oElem.tagName.toLowerCase() == "table" || oElem.tagName.toLowerCase() == "th") { 
return false; 

oElemoElemoElem = oElem.parentElement; 



/** 
* 全选当前行的checkbox 
*@state 全选的checkbox的状态 
*@author fangtf 
*@type void 
*/ 
function selectRowCheckbox(state) 

var row = GetRow(window.event.srcElement); 
var cells = row.childNodes; 
for(var i=0;i<cells.length;i++) 

var cell = cells[i].childNodes[0]; 
if(cell.tagName == "INPUT") 

cell.checked = state; 




/** 
*选中指定值的Radio 
*如:有两个radio, 
*第一个的name="ids",value="1" 
*第二个的name="ids",value="2" 
*调用方法selectRadio("ids","1"); 
*那么数值为1的Radio将被选中 
*@name radio的名称 
*@value radio的值 
*@author fangtf 
*@type void 
*/ 
function selectRadio(name,value) { 
var radioObject = document.getElementsByName(name); 
if(value === "") 

radioObject[0].checked = true; 
return; 

for (var i = 0; i < radioObject.length; i++) 

if(radioObject[i].value == value) 

radioObject[i].checked = true; 
break; 





/** 
*选中指定值的checkbox 
*如:有两个checkbox, 
*第一个的name="ids",value="1" 
*第二个的name="ids",value="2" 
*第三个的name="ids",value="3" 
*调用这个方法selectCheckbox("ids","1,2")那么数值为1,2的checkbox将被选中 

*@name 要选中的checkbox数组的名称 
*@value 判断时候选中的值 
*@author fangtf 
*@type void 
*/ 
function selectCheckbox(name,value) { 
var checkObject = document.getElementsByName(name); 
var valuevaluevalues = value.split(","); 
for(var j = 0; j < values.length; j++) 

for (var i = 0; i < checkObject.length; i++) 

if(checkObject[i].value == values[j]) 

checkObject[i].checked = true; 
break; 






/** 
*选中指定值的select 
*如:有一个名称为user的select 
*<option value="0"></option> 
*<option value="1"></option> 
*调用这个方法selectOption("user","0")那么选项为0的选项就被选中 

*@name String select的名称 
*@value String 判断时候选中的值 
*@author fangtf 
*@type void 
*/ 
function selectOption(name,value) 

var options = document.getElementsByName(name)[0].options; 
for (var i = 0; i < options.length; i++) 

if(options[i].value === value) 

options[i].selected = true; 
break; 



}

 

 

 

JS实现CheckBox多项选择值传递

 

<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>多项选择</title>
</head>

<body>
<center>
<table width="460" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>
 <form name="ck" Method="" action=""> 
<input type="hidden" name="allchecked"><!--用于賦值--> 
全选:<input type="checkbox" id="checkAll"&#111nclick="checkall()" /> 
多项选择框列表: 
<input type="checkbox" name="cb" &#118alue="1"/> 
<input type="checkbox" name="cb" &#118alue="2"/> 
<input type="checkbox" name="cb" &#118alue="3"/>
<input type="checkbox" name="cb" &#118alue="4"/>
<input type="checkbox" name="cb" &#118alue="5"/>
<input type="checkbox" name="cb" &#118alue="6"/> 
<input name="Submit" type="button" &#118alue="提交" &#111nclick="notcheckall()"> 
</form> 
 </td>
  </tr>
</table>
</center>

<script language="&#106avascript"> 
//全选或全部不选 
function checkall(){ 
 var isChecked; 
 if(document.ck.checkAll.checked==true)
  {
   isChecked=true;
   var elements=document.ck.elements; 
   var counter=elements.length; 
   var seltext=""; //定义变量存储所有选择项 
   for(i=2;i<counter;i++){ 
     var element=elements[i]; 
     if(element.type=="checkbox"){ 
     element.checked=isChecked; 
     seltext = seltext+element.&#118alue+","; //进行连接
    } 
   } 
   document.ck.allchecked.&#118alue = seltext.substr(0,seltext.length-1); //将值赋给form中的allchecked控件
   alert(document.ck.allchecked.&#118alue); 
  }
 if(document.ck.checkAll.checked==false)
 {
  isChecked=false;
  var elements=document.ck.elements; 
  var counter=elements.length; 
  for(i=0;i<counter;i++){ 
    var element=elements[i]; 
    if(element.type=="checkbox"){ 
     element.checked=isChecked; 
    } 
   }
   document.ck.allchecked.&#118alue="";
   alert(document.ck.allchecked.&#118alue);
 }

 
//选择部分
function notcheckall(){ 
 var elements=document.ck.elements; 
 var counter=elements.length; 
 var seltext=""; 
 for(i=0;i<counter;i++){ 
  var element=elements[i]; 
  if((element.type=="checkbox")&&(element.checked==true)){ 
  seltext = seltext+element.&#118alue+","; //这是jscript中的变量而已
  } 
 } 
 document.ck.allchecked.&#118alue = seltext.substr(seltext,seltext.length-1);//賦值 
 alert(document.ck.allchecked.&#118alue);

</script> 
</body>
</html>

 

 

分享到:
评论
2 楼 marui5688 2013-01-21  
  •  
1 楼 marui5688 2013-01-21  
[flash=200,200][/flash][img][/img]

相关推荐

    Jonny023#Study#mui-Radio获取选中值1

    获取radio选中值。

    jQuery操作checkbox并获取选中值

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理、动画效果和Ajax交互。本文将详细讲解如何使用jQuery来操作checkbox,并实现全选、全不选、反选以及获取选中值这四个核心功能...

    C#_winform_动态生成RadioButton和CheckBox并获取选中值

    C#的winform是没有webform的RadioButtonList和CheckBoxList这两个控件的。要实现从数据库取出数据后动态生成N个RadioButton和CheckBox并获取选中项目的值,请看本例。思路很简单,有问题请指出,相互学习共同进步,...

    JS获取选中的radio button的值

    如果Radio按钮位于一个`&lt;form&gt;`元素中,可以使用`form.elements`属性访问表单内的所有控件,包括Radio按钮: ```javascript var form = document.querySelector('form'); var selectedRadio = form.elements['...

    jQuery全选、反选与获取选中值

    在网页开发中,jQuery库为JavaScript提供了一种更简洁、更高效的API,使得操作DOM(文档对象模型)变得更加简单。本篇文章将详细讲解如何使用jQuery实现全选、反选功能,并探讨如何获取选中的值,这对于构建交互性强...

    dsp中值滤波 dsp中值滤波

    DSP(Digital Signal Processing)中的中值滤波是一种非线性的信号处理技术,它在去除噪声、边缘保护等方面具有显著优势。这种滤波方法基于排序统计理论,通过将图像或信号的每个像素点替换为其邻域内像素值的中值来...

    对图像进行中值滤波变换

    可以对图像进行快速中值滤波,对初学者很有用

    中值滤波Verilog代码

    中值滤波是一种广泛应用在数字图像处理中的非线性滤波技术,主要用于去除图像噪声,尤其是椒盐噪声。它的基本思想是将图像中每个像素点的灰度值替换为其邻域内像素点灰度值的中值,以此来平滑图像,保留边缘细节。在...

    快速中值滤波+中值滤波

    - **定义**:中值滤波的基本思想是对图像中的每个像素值进行操作,用该像素所在领域(窗口)内所有像素值的中值来替换该像素值。 - **窗口选择**:窗口通常是矩形的,但也可以采用其他形状如圆形、菱形等。 - **目的...

    matlab 中值滤波 均值滤波

    它通过对滑动窗口内的所有像素值求平均值,并将该平均值赋给中心像素,从而达到平滑图像的效果。 #### 三、MATLAB中的实现 给定代码展示了如何使用MATLAB中的`medfilt2`和`conv2`函数来进行中值滤波和均值滤波操作...

    matlab代码 中值滤波

    在图像处理领域,中值滤波是一种非常常见的去噪技术,尤其适用于消除椒盐噪声。在本资源包中,我们有一个简单的MATLAB实现,对于初学者来说,这是一个很好的起点。让我们详细了解一下中值滤波以及如何在MATLAB中实现...

    在MATLAB中对三维点云数据进行中值滤波

    在MATLAB中对三维点云数据进行中值滤波是一个重要的图像处理步骤,常用于去除噪声,特别是针对具有高斯噪声或椒盐噪声的点云数据。中值滤波是一种非线性的滤波方法,它在处理噪声时具有独特的优势,能够保留边缘信息...

    html js 清除select里的值,js控制select增删改,选中,清空, 判断控件是否存在

    - 获取选中值:可以使用`document.getElementById('mySelect').value`获取选中项的值。 - 设置选中值:假设要选中`value="option2"`的项,可以这样操作:`document.getElementById('mySelect').selectedIndex = 1;...

    中值滤波Java实现

    5. **计算中值**:对窗口内像素值进行排序后,找到中间值并将其赋给当前像素。 6. **保存结果**:遍历完成后,将处理后的数组转换回图像格式,并保存为新的图像文件。 在Java中,可以使用`java.util.Arrays.sort()...

    图像中值滤波 很不错

    循环内部首先获取像素邻域内的像素值,然后对这些值进行排序,最后将排序后位于中间位置的值(即中值)赋给当前像素。这里的`select`变量定义了邻域的大小,例如,如果`select=3`,那么邻域就是3x3的窗口。 对于24...

    中值滤波matlab代码

    中值滤波是一种广泛应用在图像处理领域的非线性滤波技术,主要用来去除图像中的噪声,尤其是椒盐噪声。在MATLAB中实现中值滤波,可以有效地改善图像质量,提高图像的可读性和后续处理的准确性。下面将详细介绍中值...

    中值滤波_matlab_中值滤波_

    在图像处理领域,中值滤波是一种非常有效的降噪技术,尤其对于消除椒盐噪声有显著效果。在本文中,我们将深入探讨中值滤波的基本原理、MATLAB中的实现方式,以及如何应用到带有椒盐噪声的图像上。 中值滤波是一种非...

    自适应中值滤波MATLAB

    自适应中值滤波函数。

Global site tag (gtag.js) - Google Analytics