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脚本
Dec 12 Javascript
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.2 0
Mar 22 Javascript
jquery 学习之二 属性相关
Nov 23 Javascript
js操作iframe父子窗体示例
May 22 Javascript
AngularJS向后端ASP.NET API控制器上传文件
Feb 03 Javascript
javascript中不易分清的slice,splice和split三个函数
Mar 29 Javascript
谈一谈js中的执行环境及作用域
Mar 30 Javascript
vue中$set的使用(结合在实际应用中遇到的坑)
Jul 10 Javascript
Vue唯一可以更改vuex实例中state数据状态的属性对象Mutation的讲解
Jan 18 Javascript
详解a标签添加onclick事件的几种方式
Mar 29 Javascript
echarts多条折线图动态分层的实现方法
May 24 Javascript
JavaScript中关于预编译、作用域链和闭包的理解
Mar 31 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横向重复区域显示二法
2008/09/25 PHP
PHP将DateTime对象转化为友好时间显示的实现代码
2011/09/20 PHP
ThinkPHP表单自动提交验证实例教程
2014/07/18 PHP
WordPress中用于检索模版的相关PHP函数使用解析
2015/12/15 PHP
php判断用户是否关注微信公众号
2016/07/22 PHP
替换php字符串中的单引号为双引号的方法
2017/02/16 PHP
通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)
2013/07/13 Javascript
Jquery在指定DIV加载HTML示例代码
2014/02/17 Javascript
JavaScript 性能优化小结
2015/10/12 Javascript
js不间断滚动的简单实现
2016/06/03 Javascript
KnockoutJS 3.X API 第四章之数据控制流if绑定和ifnot绑定
2016/10/10 Javascript
深入理解选择框脚本[推荐]
2016/12/13 Javascript
Element-ui之ElScrollBar组件滚动条的使用方法
2018/09/14 Javascript
微信小程序之onLaunch与onload异步问题详解
2019/03/28 Javascript
小程序如何使用分包加载的实现方法
2019/05/22 Javascript
Vue.use()在new Vue() 之前使用的原因浅析
2019/08/26 Javascript
JS实现排行榜文字向上滚动轮播效果
2019/11/26 Javascript
python字符串排序方法
2014/08/29 Python
简要讲解Python编程中线程的创建与锁的使用
2016/02/28 Python
总结网络IO模型与select模型的Python实例讲解
2016/06/27 Python
Python端口扫描简单程序
2016/11/10 Python
python 基本数据类型占用内存空间大小的实例
2018/06/12 Python
对Python中数组的几种使用方法总结
2018/06/28 Python
python实现批量视频分帧、保存视频帧
2019/05/31 Python
Python使用Pandas对csv文件进行数据处理的方法
2019/08/01 Python
Python3 ID3决策树判断申请贷款是否成功的实现代码
2020/05/21 Python
CSS3支持IE6, 7, and 8的边框border属性
2012/12/28 HTML / CSS
美国知名艺术画网站:Art.com
2017/02/09 全球购物
拉飞逸官网:Lafayette 148 New York
2020/07/15 全球购物
介绍一下XMLHttpRequest对象的常用方法和属性
2013/05/24 面试题
会计系个人求职信范文分享
2013/12/20 职场文书
新学期红领巾广播稿
2014/10/04 职场文书
网球场地租赁协议范本
2014/10/07 职场文书
初中生300字旷课检讨书
2014/11/19 职场文书
2014年流动人口工作总结
2014/11/26 职场文书
python 使用Tensorflow训练BP神经网络实现鸢尾花分类
2021/05/12 Python