<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.div{
background-color: #0000FF;
align-content: center;
width:100px;
height: 200px;
}
</style>
<script src="js/jquery-1.12.1.js"></script>
<script>
console.info("this1： " + this);
$(function() {
console.info("this2：" + this);
//on代表可重复触发事件，如果对同一个元素同一个事件进行多次绑定，则会按照绑定的顺序执行
$(".div").on("mouseover", function(){
console.info("(this)3: " + this);
console.info("$(this)3: " + $(this));
$(this).css("background-color", "#FFA500");
});
//one代表一次触发事件（表单提交）
$("button").one("click", function(){
alert("数据已经提交");
});
//当输入框中长度=6时，自动提交
$("input").on("keyup", function(){
console.info($(this));
var v = $(this).val();
console.info(v);
if(v.length == 6){
//trigger触发元素绑定上的事件,因为button上绑定一次性提交事件，故只会提交一次
$("button").trigger("click");
}
});
//利用off解除事件绑定,和on对应
//1、解除所有组件的事件绑定
//$("*").off("click");
$("*").off();//如果没有参数，则接触元素所有的事件
});
</script>
</head>
<body>
<div class="div">
<input type="text" />
<button>提交</button>
</div>
</body>
</html>
10-12
1272
1272
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
