js控制select选定项问题

2024-02-21 14:48
文章标签 问题 js 控制 select 选定

本文主要是介绍js控制select选定项问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

<select name="select" οnchange="aa()" id="select">
<option value="0">呵呵</option>
<option value="1">哈哈</option>
<option value="2">嘿嘿</option>
<option value="3">等等</option>
<option value="50">试试</option>
<option value="30">测试</option>
<option value="35">感觉</option></select><input name="ttt" type="button" id="ttt" οnclick="xx()" /><script language="javascript">
function aa()
{var tt=document.getElementById("select").value;alert(tt);
}
function xx()
{
var kk = document.getElementById("select").options;
for (var i=0; i<kk.length; i++) {
if (kk[i].value==30) {
kk[i].selected=true;
break;
}
}
}
</script>



var opts = document.getElementById("select").getElementsByTagName("option");
for (var i=0; i<opts.length; i++){if (opts[i].value==30){opts[i].selected=true;}
}

function xx(val) {var obj = document.getElementById('select').getElementsByTagName('option');for (var i = 0; i < obj.length; i ++) {if (obj[i].value == val) obj[i].selected = true;break;}
}

document.getElementById("select").options[30]
中的30不是value的值,而是第31个option的意思,你没有那么多option,所以报告错误的

http://bbs.csdn.net/topics/360180004



http://www.jb51.net/article/23648.htm

jQuery获取Select选择的Text和Value: 
语法解释: 
1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 
2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text 
3. var checkValue=$("#select_id").val(); //获取Select选择的Value 
4. var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值 


5. var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值 


jQuery设置Select选择的Text和Value: 
语法解释: 
1. $("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中 
2. $("#select_id ").val(4); //设置Select的Value值为4的项选中 
3. $("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中 




jQuery添加/删除Select的Option项: 
语法解释: 
1. $("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
2. $("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置) 
3. $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个) 
4. $("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个) 
5. $("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option 
5. $("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option 

http://www.jb51.net/article/23648.htm

这篇关于js控制select选定项问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/732147

相关文章

Springboot控制反转与Bean对象的方法

《Springboot控制反转与Bean对象的方法》文章介绍了SpringBoot中的控制反转(IoC)概念,描述了IoC容器如何管理Bean的生命周期和依赖关系,它详细讲解了Bean的注册过程,包括... 目录1 控制反转1.1 什么是控制反转1.2 SpringBoot中的控制反转2 Ioc容器对Bea

springboot3.4和mybatis plus的版本问题的解决

《springboot3.4和mybatisplus的版本问题的解决》本文主要介绍了springboot3.4和mybatisplus的版本问题的解决,主要由于SpringBoot3.4与MyBat... 报错1:spring-boot-starter/3.4.0/spring-boot-starter-

在 Spring Boot 中使用异步线程时的 HttpServletRequest 复用问题记录

《在SpringBoot中使用异步线程时的HttpServletRequest复用问题记录》文章讨论了在SpringBoot中使用异步线程时,由于HttpServletRequest复用导致... 目录一、问题描述:异步线程操作导致请求复用时 Cookie 解析失败1. 场景背景2. 问题根源二、问题详细分

解读为什么@Autowired在属性上被警告,在setter方法上不被警告问题

《解读为什么@Autowired在属性上被警告,在setter方法上不被警告问题》在Spring开发中,@Autowired注解常用于实现依赖注入,它可以应用于类的属性、构造器或setter方法上,然... 目录1. 为什么 @Autowired 在属性上被警告?1.1 隐式依赖注入1.2 IDE 的警告:

解决java.lang.NullPointerException问题(空指针异常)

《解决java.lang.NullPointerException问题(空指针异常)》本文详细介绍了Java中的NullPointerException异常及其常见原因,包括对象引用为null、数组元... 目录Java.lang.NullPointerException(空指针异常)NullPointer

Node.js net模块的使用示例

《Node.jsnet模块的使用示例》本文主要介绍了Node.jsnet模块的使用示例,net模块支持TCP通信,处理TCP连接和数据传输,具有一定的参考价值,感兴趣的可以了解一下... 目录简介引入 net 模块核心概念TCP (传输控制协议)Socket服务器TCP 服务器创建基本服务器服务器配置选项服

mac安装nvm(node.js)多版本管理实践步骤

《mac安装nvm(node.js)多版本管理实践步骤》:本文主要介绍mac安装nvm(node.js)多版本管理的相关资料,NVM是一个用于管理多个Node.js版本的命令行工具,它允许开发者在... 目录NVM功能简介MAC安装实践一、下载nvm二、安装nvm三、安装node.js总结NVM功能简介N

Android开发中gradle下载缓慢的问题级解决方法

《Android开发中gradle下载缓慢的问题级解决方法》本文介绍了解决Android开发中Gradle下载缓慢问题的几种方法,本文给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧... 目录一、网络环境优化二、Gradle版本与配置优化三、其他优化措施针对android开发中Gradle下载缓慢的问

HTML5中下拉框<select>标签的属性和样式详解

《HTML5中下拉框<select>标签的属性和样式详解》在HTML5中,下拉框(select标签)作为表单的重要组成部分,为用户提供了一个从预定义选项中选择值的方式,本文将深入探讨select标签的... 在html5中,下拉框(<select>标签)作为表单的重要组成部分,为用户提供了一个从预定义选项中

关于Nginx跨域问题及解决方案(CORS)

《关于Nginx跨域问题及解决方案(CORS)》文章主要介绍了跨域资源共享(CORS)机制及其在现代Web开发中的重要性,通过Nginx,可以简单地解决跨域问题,适合新手学习和应用,文章详细讲解了CO... 目录一、概述二、什么是 CORS?三、常见的跨域场景四、Nginx 如何解决 CORS 问题?五、基