jQuery获取(选中)单选,复选框,下拉框中的值


Posted in Javascript onFebruary 21, 2014

实例如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MyHtml.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="jquery-1.3.min.js"></script>
<script type="text/javascript">
function aa(){
// 获取单选按钮的值
var a = $("input[name='sex'][checked]").val();
alert(a);
}
function bb(){
// 若选中返回true,否则返回false
var c = $("#a").attr("checked");
alert(c);
// 获取单个复选框的值
var d = $("input[name='checkName'][checked]").val();
alert(d);
// 获取多个复选框的值
$("input[name='checkName'][checked]").each(function(){
if(this.checked)
alert($(this).val());
});
}
function checkWeek(){
//var $param = {};
$("#mPrefType").each(function(){
//    var key = $(this).attr("name");
//    if(!$param[key])
//        $param[key] = [];
// 获得value值
var value = $("##mPrefType option:selected").val();
alert(value);
// 获得需要的值
var name = $("##mPrefType option:selected").text();
alert(name);
});
}
</script>
</head>
<body>
Number:<input type = "text" value ="" name ="num1"/><br>
Number:<input type = "text" value ="" name = "num2"/><br>
<input type = "radio" value = "a"  name = "ss" />a
<input type = "radio" value = "b"  name = "ss" />b
<input type = "radio" value = "c"  name = "ss"/>c
<input type = "radio" value = "d"  name = "ss" >d<br>
<input type = "submit"  value = "提交"/> <br>
<hr>
<input type="radio" value="男" name="sex" id="1" onclick="aa()"/>男
<input type="radio" value="女" name="sex" id="0" onclick="aa()"/>女<br>
<input type="button" value="您选择的性别" onclick="aa()"/><br>
<hr>
<input type="checkbox" name="checkName" value="aa" id="a"/>aa
<input type="checkbox" name="checkName" value="bb" id="b"/>bb
<input type="checkbox" name="checkName" value="cc"/>cc
<input type="checkbox" name="checkName" value="dd"/>dd<br>
<input type="button" value="您选择的值是" onclick="bb()"/>
<hr>
<ul>
<li>请选泽</li>
<li>
<select id="mPrefType" name="mPrefType" class="inputS" onchange="checkWeek()">
<option value=0>请选择:</option>
<option value=1>星期一</option>
<option value=2>星期二</option>
<option value=3>星期三</option>
<option value=4>星期四</option>
<option value=5>星期五</option>
<option value=6>星期六</option>
<option value=7>星期日</option>
</select>
</li>
</ul>
</body>
</html>
Javascript 相关文章推荐
检测jQuery.js是否已加载的判断代码
May 20 Javascript
Ext GridPanel加载完数据后进行操作示例代码
Jun 17 Javascript
Javascript添加监听与删除监听用法详解
Dec 19 Javascript
jquery实现简单的表单验证
Nov 17 Javascript
常用原生JS兼容性写法汇总
Apr 27 Javascript
js实现移动端微信页面禁止字体放大
Feb 16 Javascript
JS获取短信验证码倒计时的实现代码
May 22 Javascript
解决vue-cli3 使用子目录部署问题
Jul 19 Javascript
解决vue打包后刷新页面报错:Unexpected token
Aug 27 Javascript
对layui中的onevent 和event的使用详解
Sep 06 Javascript
Vue中点击active并第一个默认选中功能的实现
Feb 24 Javascript
简单了解three.js 着色器材质
Aug 03 Javascript
jquery五角星评分插件示例分享
Feb 21 #Javascript
jQuery对下拉框,单选框,多选框的操作
Feb 21 #Javascript
jquery自定义滚动条插件示例分享
Feb 21 #Javascript
jquery制作搜狐快站页面效果示例分享
Feb 21 #Javascript
利用Jquery实现可多选的下拉框
Feb 21 #Javascript
jquery 无限级下拉菜单的简单实现代码
Feb 21 #Javascript
jQuery 无限级菜单的简单实例
Feb 21 #Javascript
You might like
深入PHP许愿墙模块功能分析
2013/06/25 PHP
使用php判断服务器是否支持Gzip压缩功能
2013/09/24 PHP
php集成环境xampp中apache无法启动问题解决方案
2014/11/18 PHP
不错的一个日期输入 动态
2006/11/06 Javascript
javascript操作JSON的要领总结
2012/12/09 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
javascript动态添加checkbox复选框的方法
2015/12/23 Javascript
JavaScript实战(原生range和自定义特效)简单实例
2016/08/21 Javascript
JS数组排序方法实例分析
2016/12/16 Javascript
js中常用的Math方法总结
2017/01/12 Javascript
JS实现的抛物线运动效果示例
2018/01/30 Javascript
layui动态渲染生成select的option值方法
2019/09/23 Javascript
Vue 开发必须知道的36个技巧(小结)
2019/10/09 Javascript
Vue computed 计算属性代码实例
2020/04/22 Javascript
windows如何把已安装的nodejs高版本降级为低版本(图文教程)
2020/12/14 NodeJs
[01:32]TI奖金增速竟因它再创新高!DOTA2勇士令状不朽珍藏Ⅰ饰品欣赏
2018/05/18 DOTA
python BeautifulSoup设置页面编码的方法
2015/04/03 Python
pymssql数据库操作MSSQL2005实例分析
2015/05/25 Python
selenium+python自动化测试之多窗口切换
2019/01/23 Python
Python实现的插入排序,冒泡排序,快速排序,选择排序算法示例
2019/05/04 Python
python列表切片和嵌套列表取值操作详解
2020/02/27 Python
python简单利用字典破解zip文件口令
2020/09/07 Python
CSS3的transition和animation的用法实例介绍
2014/08/20 HTML / CSS
Conforama西班牙:您的家具、装饰和电器商店
2020/02/21 全球购物
大学生新闻专业个人自我评价
2013/11/12 职场文书
经济与贸易专业应届生求职信
2013/11/19 职场文书
四年的个人工作自我评价
2013/12/10 职场文书
物流司机岗位职责
2013/12/28 职场文书
党员一句话承诺大全
2014/03/28 职场文书
开展党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
警察群众路线整改措施
2014/09/26 职场文书
求职自我评价怎么写
2015/03/09 职场文书
给校长的建议书范文
2015/09/14 职场文书
新手必备Python开发环境搭建教程
2021/05/28 Python
配置nginx 重定向到系统维护页面
2021/06/08 Servers
JS实现数组去重的11种方法总结
2022/04/04 Javascript