javascript如何获取checkbox值并且计算?
<input type="button" onclick="cs()" value="测试"><br/>
<input type="checkbox" id="kee" name="fxk" value="1"><br/>
<input type="checkbox" id="kee" name="fxk" value="2"><br/>
<input type="checkbox" id="kee" name="fxk" value="3"><br/>
javascript
function cs() {
var ch = document.getElementsByName("fxk"); //通过name获取复选框
var sum = 0;
for(var i=0; i<ch.length; i++){
if(ch[i].checked == true){
alert("选中" + ch[i].value); //获取复选框的值
sum += parseInt(ch[i].value); //求和
}
}
alert(sum);
}
有问题可百度Hi我!~good luck!
PS:手写的一抖,页面关了,重新写了一遍!~~~~~郁闷
写个简单的例子,如下:
html页面部分:
<input type="checkbox" value="1" name="check"/>1
<input type="checkbox" value="2" name="check"/>2
<input type="checkbox" value="3" name="check"/>3
<input type="checkbox" value="4" name="check"/>4
<input type="checkbox" value="5" name="check"/>5
<input type="button" value="求和" onclick="Math_Click()"/>
JS部分:
<script type="text/javascript">
function Math_Click(){
var rusult=0;
var check_array=document.getElementsByName("check");
for(var i=0;i<check_array.length;i++)
{
if(check_array[i].checked==true)
{
rusult=parseInt(rusult)+parseInt(check_array[i].value);
}
}
alert(rusult);
}
</script>
原理是把所有的checkbox的name值设为一样,然后查出所有的进行遍历,判断是否是选中状态然后再相加,需注意的是,页面其他标签如果有name值相同的可能会有影响,这个自己把握了
有两种方法:
1、方法一HTML结构如下:
2、方法二javascript代码如下:
3、显示效果如下:
js获得多个checkbox选中的值的方法:
一、代码如下:
二、后台获得参数为:
//获得的均为数组值:
String checboxValues=request.getParameter("checboxValue");
String checboxTexts=request.getParameter("checboxText");
//得到每个具体值:
String checboxValue=checboxValues.split(",");
String checboxText=checboxTexts.split(",");
nextSibling是获得当前对象的下一个对象,nodeValue是返回一个节点的值
使用该方法必须保证文本值在input后面,否则checkboxStr[i].nextSibling.nodeValue获取不到文本值。
三、备注:
具体如下:<%!int i = 1;%>
<c:forEach var="s" items="${requestScope.kaoshi.opt}">
<td align="right" valign="top" width="52">
<span class="style5"></span>
<input type="checkbox" name="opt" value="<%=i%>" />
</td>
<td>
${s}
<br>
<hr width="95%" align="left">
</td>
<%
i++;
%>
</tr>
</c:forEach>
然后将其中选中的值加入:
onclick="javascript:window.location='<%=request.getContextPath()%>/exam/next.do?opt=???'"