jQuery操作select的实例代码


Posted in Javascript onJune 14, 2012

select:

夺得2008年欧洲杯冠军的国家是: 
<select name="nation" id="nation"> 
<option value="">请选择</option> 
<option value="Germany">德国</option> 
<option value="France">法国</option> 
<option value="Italy">意大利</option> 
<option value="England">英国</option> 
<option value="Spain">西班牙</option> 
<option value="Greece">希腊</option> 
</select>

1、判断是否选择了国家。
if($("#nation").val()=="") { 
alert("请选择国家"); 
}

2、获取select中option项的个数。

$("#nation").find("option").length;

3、获取选中的option的值value和显示的文本text。

//获取选中项的值 
$("#nation").val(); 
//获取选中项显示的文本 
$("#nation").find("option:selected").text();

4、设置西班牙为选中项。

$("#nation").find("option[value='Spain']").attr("selected",true);

5、获取被选中的国家的索引,索引从0开始。

$("#nation").find("option:selected").index()

6、添加一个国家选项。
?

$("#nation").append("<option value='Ukraine'>乌克兰</option>");

7、删除一个国家选项。

//删除value="Italy"的选项 
$("#nation").find("option[value='Italy']").remove(); 
//删除索引为2的选项 
$("#nation").find("option[index=2]").remove();
Javascript 相关文章推荐
js替换字符串的所有示例代码
Jul 23 Javascript
js实现从数组里随机获取元素
Jan 12 Javascript
JavaScript实现简单的tab选项卡切换
Jan 05 Javascript
JavaScript数组去重的两种方法推荐
Apr 05 Javascript
Angularjs中$http以post请求通过消息体传递参数的实现方法
Aug 05 Javascript
js图片轮播插件的封装
Jul 21 Javascript
vue实现仿淘宝结账页面实例代码
Nov 08 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
Jan 12 Javascript
微信小程序实现导航栏选项卡效果
Jun 19 Javascript
JavaScript事件对象event用法分析
Jul 27 Javascript
js实现带积分弹球小游戏
Jul 21 Javascript
vue3为什么要用proxy替代defineProperty
Oct 19 Javascript
jQuery动态添加 input type=file的实现代码
Jun 14 #Javascript
jQuery 翻牌或百叶窗效果(内容三秒自动切换)
Jun 14 #Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
Jun 14 #Javascript
基于jQuery的360图片展示实现代码
Jun 14 #Javascript
基于jQuery的input输入框下拉提示层(自动邮箱后缀名)
Jun 14 #Javascript
jquery 之 $().hover(func1, funct2)使用方法
Jun 14 #Javascript
Javascript生成json的函数代码(可以用php的json_decode解码)
Jun 11 #Javascript
You might like
php+mysqli使用面向对象方式更新数据库实例
2015/01/29 PHP
php+mysqli使用面向对象方式查询数据库实例
2015/01/29 PHP
php图片水印添加、压缩、剪切的封装类实现
2020/04/18 PHP
PHP实现提取多维数组指定一列的方法总结
2019/12/04 PHP
javascript学习随笔(使用window和frame)的技巧
2007/03/08 Javascript
一个js的tab切换效果代码[代码分离]
2010/04/11 Javascript
caller和callee的区别介绍及演示结果
2013/03/10 Javascript
jQuery的选择器中的通配符使用介绍
2014/03/20 Javascript
鼠标左键单击冲突的问题解决方法(防止冒泡)
2014/05/14 Javascript
jquery获得当前html页面源码的方法
2015/07/14 Javascript
nodejs+express搭建多人聊天室步骤
2018/02/12 NodeJs
js捆绑TypeScript声明文件的方法教程
2018/04/13 Javascript
关于单文件组件.vue的使用
2018/09/20 Javascript
JS+Canvas实现五子棋游戏
2020/08/26 Javascript
Vue实现手机号、验证码登录(60s禁用倒计时)
2020/12/19 Vue.js
Python sys.path详细介绍
2013/10/17 Python
python正则表达式面试题解答
2020/04/28 Python
Python用csv写入文件_消除空余行的方法
2018/07/06 Python
python/sympy求解矩阵方程的方法
2018/11/08 Python
简单了解python gevent 协程使用及作用
2019/07/22 Python
python实现监控阿里云账户余额功能
2019/12/16 Python
python 日志 logging模块详细解析
2020/03/31 Python
Python基于数列实现购物车程序过程详解
2020/06/09 Python
CSS3 box-sizing属性
2009/04/17 HTML / CSS
瑞典手机壳品牌:Richmond & Finch
2018/04/28 全球购物
美国酒店控股公司:Choice Hotels
2018/06/15 全球购物
SCDKey德国:全球领先的数字游戏市场
2019/04/09 全球购物
Europcar意大利:汽车租赁
2019/07/07 全球购物
安全的后院和健身蹦床:JumpSport
2019/07/15 全球购物
建筑经济管理专业求职信分享
2014/01/06 职场文书
团委竞选演讲稿
2014/04/24 职场文书
圣诞节开幕词
2015/01/29 职场文书
2015中学教师个人工作总结
2015/07/22 职场文书
通过shell脚本对mysql的增删改查及my.cnf的配置
2021/07/07 MySQL
一篇文章弄懂Python关键字、标识符和变量
2021/07/15 Python
基于Redis结合SpringBoot的秒杀案例详解
2021/10/05 Redis