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 相关文章推荐
style、 currentStyle、 runtimeStyle区别分析
Aug 01 Javascript
Javascript继承机制的设计思想分享
Aug 28 Javascript
jquery数组之存放checkbox全选值示例代码
Dec 20 Javascript
使用do...while的方法输入一个月中所有的周日(实例代码)
Jul 22 Javascript
jQuery多文件异步上传带进度条实例代码
Aug 16 Javascript
微信小程序 数据封装,参数传值等经验分享
Jan 09 Javascript
解决JQuery全选/反选第二次失效的问题
Oct 11 jQuery
JS手机端touch事件计算滑动距离的方法示例
Oct 26 Javascript
详解vue-cli项目中用json-sever搭建mock服务器
Nov 02 Javascript
微信小程序ajax实现请求服务器数据及模版遍历数据功能示例
Dec 15 Javascript
jquery引入外部CDN 加载失败则引入本地jq库
May 23 jQuery
js获取form表单中name属性的值
Feb 27 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中break及continue两个流程控制指令区别分析
2011/04/18 PHP
php将csv文件导入到mysql数据库的方法
2014/12/24 PHP
浅谈PHP中单引号和双引号到底有啥区别呢?
2015/03/04 PHP
js中的escape及unescape函数的php实现代码
2007/09/04 Javascript
浅谈javascript 归并方法
2015/01/21 Javascript
使用RequireJS优化JavaScript引用代码的方法
2015/07/01 Javascript
js时钟翻牌效果实现代码分享
2020/07/31 Javascript
Es6 写的文件import 起来解决方案详解
2016/12/13 Javascript
学习使用Bootstrap栅格系统
2017/05/11 Javascript
详解ElementUI之表单验证、数据绑定、路由跳转
2017/06/21 Javascript
基于javascript 显式转换与隐式转换(详解)
2017/12/15 Javascript
详解如何实现一个简单的 vuex
2018/02/10 Javascript
Vue插槽原理与用法详解
2019/03/05 Javascript
解决layui的radio属性或别的属性没显示出来的问题
2019/09/26 Javascript
jQuery鼠标滑过横向时间轴样式(代码详解)
2019/11/01 jQuery
JS倒计时两种实现方式代码实例
2020/07/27 Javascript
在windows系统中实现python3安装lxml
2016/03/23 Python
python 实现二维字典的键值合并等函数
2019/12/06 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
详解numpy.ndarray.reshape()函数的参数问题
2020/10/13 Python
python3.8.3安装教程及环境配置的详细教程(64-bit)
2020/11/28 Python
html5通过canvas实现刮刮卡效果示例分享
2014/01/27 HTML / CSS
AmazeUI 导航条的实现示例
2020/08/14 HTML / CSS
英国网上香水店:Fragrance Direct
2016/07/20 全球购物
FILA斐乐中国官方商城:意大利运动品牌
2017/01/25 全球购物
红色康乃馨酒店:Red Carnation Hotels
2017/06/22 全球购物
美国家居装饰购物网站:Amanda Lindroth
2020/03/25 全球购物
俄罗斯首家面向中国消费者的一站式购物网站:Wruru
2020/05/08 全球购物
成语的广告词
2014/03/19 职场文书
日化店促销方案
2014/03/26 职场文书
诚实守信道德模范事迹材料
2014/08/15 职场文书
群众路线教育查摆剖析材料
2014/10/10 职场文书
中秋节晚会开场白
2015/05/29 职场文书
教师节表彰会主持词
2015/07/06 职场文书
中学语文教学反思
2016/02/16 职场文书
SqlServer 垂直分表(减少程序改动)
2021/04/16 SQL Server