JavaScript onchange 事件:表单文本域或选择域发生改变
时间:2022-04-25
本文章向大家介绍JavaScript onchange 事件:表单文本域或选择域发生改变,主要内容包括JavaScript onchange 事件、支持该事件的 JavaScript 对象、onchange 实例、基本概念、基础应用、原理机制和需要注意的事项等,并结合实例形式分析了其使用技巧,希望通过本文能帮助到大家理解应用这部分内容。
JavaScript onchange 事件
表单文本域或选择域发生改变时会触发 onchange 事件。
支持该事件的 HTML 标签
<input type="text">, <select>, <textarea>
支持该事件的 JavaScript 对象
fileUpload, select, text, textarea
onchange 实例
下面的例子演示了 select 下拉选择列表,当列表内无合适选择项而让用户自定义选择项的效果:
<html>
<head>
<script type="text/javascript">
function checkArea(x){
var other_area = document.getElementById( "other_area" );
if(x.value == "other"){
other_area.style.display = "inline";
} else {
other_area.style.display = "none";
}
}
</script>
</head>
<body>
<form>
<p>
请选择所在地区:<select name="area" onchange="checkArea(this);">
<option value="bj"> 北京 </option>
<option value="tj"> 天津 </option>
<option value="sh"> 上海 </option>
<option value="other"> 其他 </option>
</select>
</p>
<p id="other_area" style="display:none;">
请填写地区:<input type="text" />
</p>
</form>
</body>
</html>
- CSS魔法堂:你真的懂text-align吗?
- 黑客可以利用传感器数据来破解手机密码
- spring-boot 速成(3) actuator
- 利用sharding-jdbc分库分表
- 利用sharding-jdbc分库分表
- 协议森林17 我和你的悄悄话 (SSL/TLS协议)
- spring-boot 速成(1) helloworld
- spring-boot 速成(1) helloworld
- 协议森林16 小美的桌号(DHCP协议)
- struts2(一)之初识struts2
- AI聊天机器人备受青睐 专家呼吁少卖萌
- CQRS框架:AxonFramework 之 Hello World
- Kubernetes的服务网格(第4部分):通过流量切换持续部署
- TortoiseGit安装与配置
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法