jquery如何监听select的改变

监听步骤:1、利用change()给select元素绑定改变事件,并设置事件处理函数,语法“$(“select”).change(function() {…});”;2、在事件处理函数中,设置事件触发后需要执行的代码,语法“alert(“选项已被改变”);console.log($(‘select’).val());”,当发生改变后,会弹窗提醒,并获取新选项内容。

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

在jquery中,可以利用自带的监听函数change()来监听select的改变。

当元素的值改变时发生 change 事件(仅适用于表单字段)。

change() 方法触发 change 事件,或规定当发生 change 事件时运行的函数。

注意:当用于 select 元素时,change 事件会在选择某个选项时发生。

实现步骤

步骤1:利用change()给select元素绑定改变事件,并设置事件处理函数

$("select").change(function() {	//事件触发后,执行的代码});

步骤2:在事件处理函数中,设置事件触发后需要执行的代码

$("select").change(function() {	alert("选项已被改变");	console.log($('select').val());});

这样在select发生改变后,会弹窗提醒,并获取新选项内容

实现代码:

<!DOCTYPE html><html>	<head>		<meta charset="UTF-8">		<script src="js/jquery-3.6.1.min.js"></script>		<script>			$(document).ready(function() {				$("select").change(function() {					alert("select已改变");					console.log($('select').val());				});			});		</script>	</head>	<body>		<div id="cont">			<select>				<option value="目的地">目的地</option>				<option value="温州">温州</option>				<option value="永嘉">永嘉</option>			</select>		</div>	</body></html>

jquery如何监听select的改变

关于“jquery如何监听select的改变”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注亿速云行业资讯频道,小编每天都会为大家更新不同的知识点。

文章标题:jquery如何监听select的改变,发布者:亿速云,转载请注明出处:https://worktile.com/kb/p/24650

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
亿速云的头像亿速云认证作者
上一篇 2022年9月13日 下午11:39
下一篇 2022年9月13日 下午11:40

相关推荐

  • 使用ajax要不要引入jquery

    使用ajax不需要引入jquery;ajax全称是“Asynchronous javascript and XML”,也即异步JavaScript和XML,是指一种创建交互网页应用的网页开发技术,JavaScript原本就支持ajax,若是使用原生的ajax请求,当然不需要引入jquery。 本文操…

    2022年8月31日
    69900
  • windows deepl如何卸载

    deepl卸载方法 1、点击控制面板。 2、点击“程序和功能” 3、右键想要卸载的软件,卸载maya的这里就右键maya。 4、点击卸载即可。 以上就是“windows deepl如何卸载”这篇文章的所有内容,感谢各位的阅读!相信大家阅读完这篇文章都有很大的收获,小编每天都会为大家更新不同的知识,如…

    2022年9月26日
    1.6K00
  • mysql的配置文件是哪个

    Windows操作系统中的MySQL配置文件是“my.ini”,位置一般在MySql安装的根目录下,也有可能在隐藏文件夹“ProgramData”下面;而Linux操作系统中的MySQL配置文件是“my.cnf”,位置一般在“/etc/my.cnf”或“/etc/mysql/my.cnf”目录下。 …

    2022年9月20日
    3.4K00
  • MySQL数据库线上如何修改表结构

    一、MDL元数据锁 在修改表结构之前,先来看下可能存在的问题。 1、什么是MDL锁 MySQL有一个把锁,叫做MDL元数据锁,当对表修改的时候,会自动给表加上这把锁,也就是不需要自己显式使用。 当对表做增删改查的时候,加的是MDL读锁 当对表结构做变更修改的时候,加的是MDL写锁 读与读之间不互斥,…

    2022年9月8日
    68200
  • SQL Server怎么使用CROSS APPLY与OUTER APPLY实现连接查询

    概述 CROSS APPLY 与 OUTER APPLY 可以做到:左表一条关联右表多条记录时,我需要控制右表的某一条或多条记录跟左表匹配的情况。 有两张表:Student(学生表)和 Score(成绩表),数据如下: 一、CROSS APPLY ROSS APPLY 的意思是“交叉应用”,在查询时…

    2022年8月29日
    62000
  • C语言内存分配函数被污染的示例分析

    1、被污染的内存分配 C 语言的内存分配函数包括 malloc()、 kmalloc 、 smalloc()、 xmalloc()、realloc()、 calloc()、 GlobalAlloc()、 HeapAlloc()等等,以 malloc()为例, malloc() 函数的原型为: ext…

    2022年9月20日
    59400
  • 小程序中如何实现excel数据批量导入

    1 建立数据源 要想将数据入库,就先需要建立数据源。登录微搭控制台,点击数据源,点击新建数据模型 输入名称和标识 数据源建立之后需要创建字段,点击添加字段 初学者最大的疑问是我需要建哪些字段,字段是个什么概念?我们还是先看一下我们的腾讯文档的在线表格 会用excel的人都知道,excel里有行和列的…

    2022年9月18日
    95300
  • windows证照之星如何换背景色

    证照之星换背景色的方法 1、 打开证照之星软件,添加图片之后点击选项栏的“背景处理”选项按钮。 2、点击选项后会跳出下图所示的界面内容。 3、背景处理中有涂抹功能和清除功能,分别是画出抠图范围和擦掉抠图范围。 4、完成达到自身要求的抠图后点击“处理”按钮, 然后可以为抠出来的图像选择证照之星软件自带…

    2022年9月26日
    75500
  • windows7操作系统有哪些版本

    windows7操作系统分为六个版本:1、Starter版本,只通过OEM计算机预装;2、HomeBasic版本,是win7经过简化的一种版本;3、HomePremium版本,能够给家庭用户提供更多的需求;4、Professional版,支持演示模式、加强的网络功能等等;5、Enterprise版本…

    2022年9月15日
    1.1K00
  • win7如何清理c盘垃圾不影响系统

    win7清理c盘垃圾不影响系统的方法 1、 双击计算机图标,进入资源管理器。 2、右击C盘,选择属性 3、点击常规,点击磁盘清理。 4、勾选需要清理的文件点击确定即可。 读到这里,这篇“win7如何清理c盘垃圾不影响系统”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会…

    2022年9月24日
    1.3K00
注册PingCode 在线客服
站长微信
站长微信
电话联系

400-800-1024

工作日9:30-21:00在线

分享本页
返回顶部