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)全不选

不弹窗口

Javascript 相关文章推荐
Jquery中的CheckBox、RadioButton、DropDownList的取值赋值实现代码
Oct 12 Javascript
用原生JavaScript实现jQuery的$.getJSON的解决方法
May 03 Javascript
如何从jQuery的ajax请求中删除X-Requested-With
Dec 11 Javascript
javascript实现多级联动下拉菜单的方法
Feb 06 Javascript
jquery.map()方法的使用详解
Jul 09 Javascript
javascript手风琴下拉菜单实现代码
Nov 12 Javascript
基于Jquery和html5的7款个性化地图插件
Nov 17 Javascript
JavaScript与HTML的结合方法详解
Nov 23 Javascript
BootStrap 图片样式、辅助类样式和CSS组件的实例详解
Jan 20 Javascript
在 Angular 中使用Chart.js 和 ng2-charts的示例代码
Aug 17 Javascript
Vue cli+mui 区域滚动的实例代码
Jan 25 Javascript
关于Vue组件库开发详析
Jul 01 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
You might like
PHP 页面跳转到另一个页面的多种方法方法总结
2009/07/07 PHP
php self,$this,const,static,-&amp;gt;的使用
2009/10/22 PHP
thinkphp3.0输出重复两次的解决方法
2014/12/19 PHP
PHP与服务器文件系统的简单交互
2016/10/21 PHP
PHP 文件上传限制问题
2019/09/01 PHP
ASP.NET jQuery 实例8 (动态添加内容到DropDownList)
2012/02/03 Javascript
javascript实现促销倒计时+fixed固定在底部
2013/09/18 Javascript
JavaScript解析json格式数据简单示例
2014/12/09 Javascript
JavaScript实现Java中StringBuffer的方法
2015/02/09 Javascript
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
2017/01/20 Javascript
node中Express 动态设置端口的方法
2017/08/04 Javascript
为vue-router懒加载时下载js的过程中添加loading提示避免无响应问题
2018/04/03 Javascript
Node.js引入UIBootstrap的方法示例
2018/05/11 Javascript
React key值的作用和使用详解
2018/08/23 Javascript
vue通过style或者class改变样式的实例代码
2018/10/30 Javascript
详解Vue-cli3 项目在安卓低版本系统和IE上白屏问题解决
2019/04/14 Javascript
js实现弹出框的拖拽效果实例代码详解
2019/04/16 Javascript
vue实现路由不变的情况下,刷新页面操作示例
2020/02/02 Javascript
浅谈python中的面向对象和类的基本语法
2016/06/13 Python
如何在sae中设置django,让sae的工作环境跟本地python环境一致
2017/11/21 Python
在Python中通过getattr获取对象引用的方法
2019/01/21 Python
python 多进程并行编程 ProcessPoolExecutor的实现
2019/10/11 Python
tensorflow实现训练变量checkpoint的保存与读取
2020/02/10 Python
python实现梯度下降和逻辑回归
2020/03/24 Python
python os.rename实例用法详解
2020/12/06 Python
Sneaker Studio乌克兰:购买运动鞋
2018/03/26 全球购物
大学生个人推荐信范文
2013/11/25 职场文书
数控技术学生的自我评价
2014/02/15 职场文书
中学校庆方案
2014/03/17 职场文书
美术教师岗位职责
2014/03/18 职场文书
法人授权委托书范本
2014/04/04 职场文书
幼儿园课题实施方案
2014/05/14 职场文书
小学德育工作经验交流材料
2014/05/22 职场文书
幼儿教师年度个人总结
2015/02/05 职场文书
2016暑期社会实践新闻稿
2015/11/25 职场文书
Win11 Build 21996.1 Dev版怎么样? win11系统截图欣赏
2021/11/21 数码科技