我是靠谱客的博主 耍酷星星,这篇文章主要介绍jquery怎么修改select的选中值,现在分享给大家,希望可以做个参考。

本教程操作环境:windows7系统、jquery3.6.1版本、Dell G3电脑。

select 元素可创建单选或多选菜单。

option 元素定义下拉列表中的一个选项(一个条目)。

浏览器将 <option> 标签中的内容作为 <select> 标签的菜单或是滚动列表中的一个元素显示。

jquery修改select选中值的方法

在jquery中,可以通过给指定option元素添加selected属性来修改select选中值。

属性描述
selectedselected规定选项(在首次显示在列表中时)表现为选中状态。

实现步骤:

步骤1、使用属性选择器选取原选中值,并利用attr()函数将选中状态去除

复制代码
1
$("[selected]").attr("selected", false);
登录后复制

步骤2、通过id属性值获取指定option元素,并利用attr()函数给该元素设置选中状态

复制代码
1
$("#id值").attr("selected", "selected");
登录后复制

实现示例代码

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="js/jquery-3.6.1.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("button").click(function() { $("[selected]").attr("selected", false); $("#opel").attr("selected", "selected"); }); }); </script> </head> <body> <select> <option>请选择选项</option> <option value ="volvo">Volvo</option> <option value ="saab">Saab</option> <option id="opel" value="opel">Opel</option> <option value="audi">Audi</option> </select> <button>修改选中值为Opel</button> </body> </html>
登录后复制

1.gif

说明:

attr() 方法可以设置被选元素的属性和值。

设置单个属性的语法

复制代码
1
$(selector).attr(attribute,value)
登录后复制
参数描述
attribute规定属性的名称。
value规定属性的值。

设置多个属性/值对

为被选元素设置一个以上的属性和值。

复制代码
1
$(selector).attr({attribute:value, attribute:value ...})
登录后复制
参数描述
attribute:value规定一个或多个属性/值对。

【推荐学习:jQuery视频教程、web前端视频】

以上就是jquery怎么修改select的选中值的详细内容,更多请关注靠谱客其它相关文章!

最后

以上就是耍酷星星最近收集整理的关于jquery怎么修改select的选中值的全部内容,更多相关jquery怎么修改select内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(107)

评论列表共有 0 条评论

立即
投稿
返回
顶部