编程 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 相关文章推荐

JavaScript之Getters和Setters 平台支持等详细介绍

Dec 07 Javascript

简单的Jquery遮罩层代码实例

Nov 14 Javascript

setInterval计时器不准的问题解决方法

May 08 Javascript

jQuery 处理页面的事件详解

Jan 20 Javascript

JS中的THIS和WINDOW.EVENT.SRCELEMENT详解

May 25 Javascript

深入解析JavaScript编程中的this关键字使用

Nov 09 Javascript

Jquery1.9.1源码分析系列（六）延时对象应用之jQuery.ready

Nov 24 Javascript

JavaScript基础——使用Canvas绘图

Nov 02 Javascript

详解jQuery简单的表格应用

Dec 16 Javascript

微信小程序picker组件下拉框选择input输入框的实例

Sep 20 Javascript

VUE饿了么树形控件添加增删改功能的示例代码

Oct 17 Javascript

JavaScript使用Math.random()生成简单的验证码

Jan 21 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