jQuery对下拉框,单选框,多选框的操作


Posted in Javascript onFebruary 21, 2014

下拉框:

//得到下拉菜单的选中项的文本(注意中间有空格)
var cc1 = $(".formc select[@name='country'] option[@selected]").text();
//得到下拉菜单的选中项的值
var cc2 = $('.formc select[@name="country"]').val();
//得到下拉菜单的选中项的ID属性值
var cc3 = $('.formc select[@name="country"]').attr("id");
//清空下拉框//
$("#select").empty();$("#select").html('');
//添加下拉框的option
$("<option value='1'>1111</option>").appendTo("#select")

稍微解释一下:

select[@name='country'] option[@selected]

表示具有name 属性,并且该属性值为'country' 的select元素里面的具有selected 属性的option 元素。可以看出有@开头的就表示后面跟的是属性。

单选框:

//得到单选框的选中项的值(注意中间没有空格)
$("input[@type=radio][@checked]").val();
//设置单选框value=2的为选中状态.(注意中间没有空格)
$("input[@type=radio][@value=2]").attr("checked",'checked');

复选框:

//得到复选框的选中的第一项的值
$("input[@type=checkbox][@checked]").val();
//由于复选框一般选中的是多个,所以可以循环输出
$("input[@type=checkbox][@checked]").each(function(){
alert($(this).val());
});
//不打勾
$("#chk1").attr("checked",'');
//打勾
$("#chk2").attr("checked",true);
//判断是否已经打勾
if($("#chk1").attr('checked')==undefined){}

Javascript 相关文章推荐
javascript 设置某DIV区域内的checkbox复选框
Nov 30 Javascript
js 代码优化点滴记录
Feb 19 Javascript
JS正则中的RegExp对象对象
Nov 07 Javascript
js实现点击链接后窗口缩小并居中的方法
Mar 02 Javascript
在JavaScript中处理时间之setMinutes()方法的使用
Jun 11 Javascript
JS实现三级折叠菜单特效,其它级可自动收缩
Aug 06 Javascript
jquery带下拉菜单和焦点图代码分享
Aug 24 Javascript
手机图片预览插件photoswipe.js使用总结
Aug 25 Javascript
vue之nextTick全面解析
May 17 Javascript
微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法
Dec 14 Javascript
详解plotly.js 绘图库入门使用教程
Feb 23 Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 Javascript
jquery自定义滚动条插件示例分享
Feb 21 #Javascript
jquery制作搜狐快站页面效果示例分享
Feb 21 #Javascript
利用Jquery实现可多选的下拉框
Feb 21 #Javascript
jquery 无限级下拉菜单的简单实现代码
Feb 21 #Javascript
jQuery 无限级菜单的简单实例
Feb 21 #Javascript
js控制table合并具体实现
Feb 20 #Javascript
js文件Cookie存取值示例代码
Feb 20 #Javascript
You might like
php在文件指定行中写入代码的方法
2012/05/23 PHP
有道搜索和IP138的IP的API接口(PHP应用)
2012/11/29 PHP
php将文件夹打包成zip文件的简单实现方法
2016/10/04 PHP
Windows下php+mysql5.7配置教程
2017/05/16 PHP
[原创]php token使用与验证示例【测试可用】
2017/08/30 PHP
CI框架附属类用法分析
2018/12/26 PHP
php进行md5加密简单实例方法
2019/09/19 PHP
幻灯片带网页设计中的20个奇妙应用示例小结
2012/05/27 Javascript
JS幻灯片可循环播放可平滑旋转带滚动导航(自写)
2013/08/05 Javascript
JS预览图像将本地图片显示到浏览器上
2013/08/25 Javascript
Vue.js组件tree实现省市多级联动
2016/12/02 Javascript
解析Javascript单例模式概念与实例
2016/12/05 Javascript
AngularJS基于ngInfiniteScroll实现下拉滚动加载的方法
2016/12/14 Javascript
深入理解react-router@4.0 使用和源码解析
2017/05/23 Javascript
Node使用Sequlize连接Mysql报错:Access denied for user ‘xxx’@‘localhost’
2018/01/03 Javascript
vue页面加载闪烁问题的解决方法
2018/03/28 Javascript
Bootstrap Table列宽拖动的方法
2018/08/15 Javascript
js 实现watch监听数据变化的代码
2019/10/13 Javascript
Vue组件模板及组件互相引用代码实例
2020/03/11 Javascript
Python中的lstrip()方法使用简介
2015/05/19 Python
利用Python批量压缩png方法实例(支持过滤个别文件与文件夹)
2017/07/30 Python
python之django母板页面的使用
2018/07/03 Python
python实现AES加密与解密
2019/03/28 Python
一篇文章了解Python中常见的序列化操作
2019/06/20 Python
在脚本中单独使用django的ORM模型详解
2020/04/01 Python
基于OpenCV的路面质量检测的实现
2020/11/04 Python
python简单实现插入排序实例代码
2020/12/16 Python
HTML+CSS3 模仿Windows7 桌面效果
2010/06/17 HTML / CSS
用HTML5制作视频拼图的教程
2015/05/13 HTML / CSS
行政助理的职责
2013/11/14 职场文书
医药专业推荐信
2013/11/15 职场文书
街道党工委党的群众路线教育实践活动对照检查材料思想汇报
2014/10/05 职场文书
校长个人总结
2015/03/03 职场文书
Django 实现jwt认证的示例
2021/04/30 Python
详解Python函数print用法
2021/06/18 Python
解决redis批量删除key值的问题
2022/03/23 Redis