jQuery操作select的实例代码 - Web前端
作者:98wpeu发布时间:2026-06-12分类:网页前端技术浏览:2
导读:select:复制代码代码如下:夺得2008年欧洲杯冠军的国家是:<selectname="nation"id="nation"><optionva...
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();
复制代码 代码如下:
夺得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();
- 上一篇:jQuery实现下拉框左右选择的简单实例 - Web前端
- 下一篇:已经是最后一篇了
相关推荐
- jQuery中将函数赋值给变量的调用方法 - Web前端
- jQuery实现下拉框左右选择的简单实例 - Web前端
- 通过jquery还原含有rowspan、colspan的table的实现方法 - Web前端
- ASP.NET中AJAX 调用实例代码 - Web前端
- jQuery的deferred对象使用详解 - Web前端
- ASP.NET jQuery 实例9 通过控件hyperlink实现返回顶部效果 - Web前端
- input 和 textarea 输入框最大文字限制的jquery插件 - Web前端
- 初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能 - Web前端
- jquery中dom操作和事件的实例学习 下拉框应用 - Web前端
- JQuery里面的几种选择器 查找满足条件的元素$("#控件ID") - Web前端
- 网页前端技术排行
- 最近发表
-
- WordPress随机显示特色图片插件:Random Post Thumbnails
- KeePass实现Chrome浏览器自动填充密码方法一
- LNMP一键包nginx 301强制跳转到https教程
- KeePass实现Chrome浏览器自动填充密码方法二
- #建站# 免费的VPS管理软件Xshell8/Xftp8中文版下载
- 使用Xshell 8连接VPS教程_电脑登录vps的方法
- WordPress评论界面添加烟花????效果
- 不同浏览器书签同步方案:坚果云+Floccus_详细使用教程
- iOS端KeePassXC客户端APP:Strongbox Password Safe
- 给WordPress评论中的Gravatar头像图片添加ALT属性


