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 相关文章推荐
js和jquery批量绑定事件传参数一(新猪猪原创)
Jun 23 Javascript
为jQuery.Treeview添加右键菜单的实现代码
Oct 22 Javascript
jquery提交form表单时禁止重复提交的方法
Feb 13 Javascript
用console.table()调试javascript
Sep 04 Javascript
谈谈impress.js初步理解
Sep 09 Javascript
window.location.hash知识汇总
Nov 09 Javascript
详解vue.js全局组件和局部组件
Apr 10 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
Sep 04 Javascript
默认浏览器设置及vue自动打开页面的方法
Sep 21 Javascript
JavaScript惰性载入函数实例分析
Mar 27 Javascript
JS实现百度搜索框关键字推荐
Feb 17 Javascript
原生js实现日期选择插件
May 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
jQuery 无限级菜单的简单实例
Feb 21 #Javascript
You might like
在PHP里得到前天和昨天的日期的代码
2007/08/16 PHP
ThinkPHP自动完成中使用函数与回调方法实例
2014/11/29 PHP
PHP实现抓取迅雷VIP账号的方法
2015/07/30 PHP
对laravel的session获取与存取方法详解
2019/10/08 PHP
用js实现控制内容的向上向下滚动效果
2007/06/26 Javascript
jQuery 使用个人心得
2009/02/26 Javascript
Mootools 1.2教程 输入过滤第二部分(字符串)
2009/09/15 Javascript
基于jquery的模态div层弹出效果
2010/08/21 Javascript
基于jQuery的实现简单的分页控件
2010/10/10 Javascript
js限制文本框为整数和货币的函数代码
2010/10/13 Javascript
公共js在页面底部加载的注意事项介绍
2013/07/18 Javascript
JavaScript DOM节点添加示例
2014/07/16 Javascript
noty ? jQuery通知插件全面解析
2016/05/18 Javascript
解决微信小程序云开发中获取数据库的内容为空的方法
2019/05/15 Javascript
Angular进行简单单元测试的实现方法实例
2020/08/16 Javascript
[01:04:14]OG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
[03:12]完美世界DOTA2联赛PWL DAY7集锦
2020/11/06 DOTA
Python类方法__init__和__del__构造、析构过程分析
2015/03/06 Python
Python文档生成工具pydoc使用介绍
2015/06/02 Python
最近Python有点火? 给你7个学习它的理由!
2017/06/26 Python
python 连接sqlite及简单操作
2017/06/30 Python
详解python里使用正则表达式的全匹配功能
2017/10/19 Python
Python I/O与进程的详细讲解
2019/03/08 Python
Python面向对象思想与应用入门教程【类与对象】
2019/04/12 Python
python tkinter基本属性详解
2019/09/16 Python
python GUI库图形界面开发之PyQt5信号与槽基础使用方法与实例
2020/03/06 Python
python3.7中安装paddleocr及paddlepaddle包的多种方法
2020/11/27 Python
python 爬虫网页登陆的简单实现
2020/11/30 Python
TensorFlow的环境配置与安装方法
2021/02/20 Python
Move Free官方海外旗舰店:美国骨关节健康专业品牌
2017/12/06 全球购物
卡西欧B级产品官方网站:Casio Outlet
2018/05/22 全球购物
德国在线订购鲜花:Fleurop
2018/08/25 全球购物
奥运会口号
2014/06/13 职场文书
2015年教师节贺卡寄语
2015/03/24 职场文书
停电通知范文
2015/04/16 职场文书
vue动态绑定style样式
2022/04/20 Vue.js