编程 Javascript

jQuery中的val()示例应用

Posted in Javascript onFebruary 26, 2014

1、实例源码

<!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=utf-8" /> 
<title>jQuery中的val()</title> 
<script type="text/javascript" src="jquery-2.1.0.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$("#btn").click(function(){ 
$("input[name=ckb]:checked").each(function() { 
alert($(this).val()); 
}); 
}); }); 
</script> 
</head> 
<body> 
<div id="div1"> 
<table> 
<tr> 
<td> 
<input type="checkbox" id="ckb1" name="ckb" value="篮球"/>篮球 
<input type="checkbox" id="ckb2" name="ckb" value="足球"/>足球 
<input type="checkbox" id="ckb3" name="ckb" value="排球"/>排球 
</td> 
</tr> 
<tr> 
<td> 
<input type="button" id="btn" value="取值"/> 
</td> 
</tr> 
</table> 
</div> 
</body> 
</html>

2、结果如下

（1）选中所有的

依次弹出“篮球、足球和排球”

（2）选中部分

依次弹出相应的值

（3）全不选

不弹窗口

jQuery中的val()示例应用

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

在 IE 中调用 javascript 打开 Excel 表

Dec 21 Javascript

js动态创建、删除表格示例代码

Aug 07 Javascript

jQuery支持动态参数将函数绑定到事件上的方法

Mar 17 Javascript

javascript原型模式用法实例详解

Jun 04 Javascript

jQuery实现模拟marquee标签效果

Jul 14 Javascript

ES6新特性四：变量的解构赋值实例

Apr 21 Javascript

ActiveX控件的使用-js实现打印超市小票功能代码详解

Nov 22 Javascript

vue select选择框数据变化监听方法

Aug 24 Javascript

开源一个微信小程序仪表盘组件过程解析

Jul 30 Javascript

vue-router 中 meta的用法详解

Nov 01 Javascript

jQuery中getJSON跨域原理的深入讲解

Sep 02 jQuery

详解webpack的clean-webpack-plugin插件报错

Oct 16 Javascript

jquery live()调用不存在的解决方法

Feb 26 #Javascript

js获得参数的getParameter使用示例

Feb 26 #Javascript

父节点获取子节点的字符串示例代码

Feb 26 #Javascript

简单选项卡 js和jquery制作方法分享

Feb 26 #Javascript

display和visibility的区别示例介绍

Feb 26 #Javascript

js 赋值包含单引号双引号问题的解决方法

Feb 26 #Javascript

js返回上一页并刷新的多种实现方法

Feb 26 #Javascript