• 技术文章 >web前端 >js教程

    详解JS onchange事件在下拉框中的使用

    藏色散人藏色散人2022-08-07 11:14:10转载124

    本文给大家介绍js onchange 事件在下拉框中的使用,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<script type="text/javascript" src="js/jquery-1.4.js" ></script>
    	</head>
    	<body>
    		
        <!--onchange 事件会在域的内容改变时发生。
            onchange 事件也可用于单选框与复选框,下拉框改变后触发的事件。-->
    		<select id="sxbh" onchange="xzsx();">
    		   <option value="1">下拉1</option>
    		   <option value="2">下拉2</option>
    		   <option value="3">下拉3</option>
    	    </select>
    		  
    		<script>
    			function xzsx(){
    				console.log("xzsx函数被调用了");
    				var sxbh = document.getElementById("sxbh").value;
    				console.log(sxbh)
    				
    				//我们拿到sxbh值后,可以做其他;逻辑处理,或者带上参数发送ajax
    //			    jQuery.ajax({
    //				url: "/", 
    //				async: false,
    //				type: "POST",
    //				data: {SXBH:sxbh},
    //				success: function(data){
    //					xzsxList = JSON.parse(data);
    //					leftList = JSON.parse(data);
    //				}
    //			});
    		};
    			
    		</script>
    	</body>
    </html>

    在这里插入图片描述
    效果:
    在这里插入图片描述

    相关推荐:【JavaScript视频教程

    以上就是详解JS onchange事件在下拉框中的使用的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:csdn,如有侵犯,请联系admin@php.cn删除
    专题推荐:事件对象 javascript
    上一篇:JavaScript DOM 常用事件最新总结! 下一篇:这些核心知识点,前后端沟通必须掌握!
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• JS如何给下拉框设置默认值?• JS 中 onchange 事件如何使用?• Angularjs自定义一个可输入的下拉框组件(代码示例)• vue.js如何取消下拉框选择数据• javascript怎么实现隐藏下拉框
    1/1

    PHP中文网