js触发button的点击事件

最新推荐文章于 2025-07-14 16:58:14 发布

转载最新推荐文章于 2025-07-14 16:58:14 发布 · 5.8w 阅读

收录于

当前文章被以下社区和专栏收录：

本文详细介绍了JQuery中实现点击事件的多种方法，包括直接绑定、on方法绑定及通过委托方式绑定点击事件的示例代码，同时展示了如何通过触发器模拟点击行为。

1. $(".tab").click(function () {  })

2. $(".tab").on("click",function () {  })

3. $(document).on("click", ".tab",function () {  })

4. 使用<onclick="">触发函数

function load(){
    //下面两种方法效果是一样的
    document.getElementById("target").onclick();
    document.getElementById("target").click();
}

$(function(){
                
　　// test 的点击事件
　　$("#test").click(function(){
                
　　　　alert("点击了");
　　});
                
　　// 调用 test 的点击事件的两种方法
　　 $("#test").trigger("click");
　　 $("#test").click()
})

JQuery绑定click事件的3种写法：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
 
<script type="text/javascript" src="../js/WdatePicker.js"></script>
<link rel="stylesheet" type="text/css" href="../css/WdatePicker.css"> 
<script type="text/javascript">
$(document).ready(function(){
	$("#text").bind("click",function(){
		alert("我的id为text，你点击时触发");
	});
	
	$("#text1").on("click",function(){
		alert("hellworl");
	});
	
	$("#text2").click(function(){
		alert($("#text2").val());
		
	});
});
	
	
</script>
<body>
	
	<input id="text" type="button" value="点击"/> 
	
	<input id="text1" type="button" value="点击"/> 
	
	<input id="text2" type="text" value="love"/> 
</body>
</html>