<head runat="server">
<title></title>
<script src="JS/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript" >
$(function () {
//绑定一个事件
$("#pBind").bind("click", function () {
alert($(this).text());
});
//绑定多个事件
$("#btnClick").bind({
click: function () { $("#moreEvents").slideToggle(); },
// mouseover: function () { $("body").css("background-color", "red"); },
// mouseout: function () { $("body").css("background-color", "#FFFFFF"); }
mouseover: function () { $("#divOver").css("background-color", "blue"); $("#pOut").css({ "background-color": "green", "font-size": "18pt" }) },
mouseout: function () { $("#pOut").css("background-color", "#fff"); $("#divOver").css("background-color","#fff") }
// mouseover: function () { $("body").css("backgroud-color", "blue"); },
// mouseout: function () { $("body").css("backgroud-color", "red");}
});
// $("#btnClick").bind({
// click: function () { $("#moreEvents").slideToggle(); },
// mouseover: function () { $("body").css("background-color", "red"); },
// mouseout: function () { $("body").css("background-color", "#FFFFFF"); }
// });
//one 为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数。 此事件只执行一次
$("#pOne").one("click", foo);
$(".clickme").live("click", function () {
alert($(this).text());
});
//从元素中删除先前用.live()绑定的所有事件.(此方法与live正好完全相反。)
$(".clickme").click(function () {
$(".clickme").die("click");
});
// $(".clickme").die("click", function () {
// alert($(this).text());
// });
});
var foo = function () {
alert($(this).text());
};
</script>
<style type="text/css">
.clickme
{ height:150px;
width:150px;
border:2px solid green;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<p id = "pBind">dddd</p>
<P id="moreEvents" ></p>
<button type="button" name="btnClick" id="btnClick" value ="Click" >Click me</button>
<p id="pOne">此事件只执行一次</p>
</div>
<div class="clickme">Please click here!</div>
<div class ="clickme">Please click another DIV!</div>
<div id ="divOver">Div moseover,please click.pain,fortunate,lucky</div>
<p id="pOut">P 標籤,鼠標移開,,mouseout ,shoot afraid ,</p>
<input id="Text1" type="text" style ="display: " />
<select id="Select1" style =" display :none">
<option></option>
</select>
</form>
</body>
</html><head runat="server">
<title></title>
<script src="JS/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript" >
$(function () {
//绑定一个事件
$("#pBind").bind("click", function () {
alert($(this).text());
});
//绑定多个事件
$("#btnClick").bind({
click: function () { $("#moreEvents").slideToggle(); },
// mouseover: function () { $("body").css("background-color", "red"); },
// mouseout: function () { $("body").css("background-color", "#FFFFFF"); }
mouseover: function () { $("#divOver").css("background-color", "blue"); $("#pOut").css({ "background-color": "green", "font-size": "18pt" }) },
mouseout: function () { $("#pOut").css("background-color", "#fff"); $("#divOver").css("background-color","#fff") }
// mouseover: function () { $("body").css("backgroud-color", "blue"); },
// mouseout: function () { $("body").css("backgroud-color", "red");}
});
// $("#btnClick").bind({
// click: function () { $("#moreEvents").slideToggle(); },
// mouseover: function () { $("body").css("background-color", "red"); },
// mouseout: function () { $("body").css("background-color", "#FFFFFF"); }
// });
//one 为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数。 此事件只执行一次
$("#pOne").one("click", foo);
$(".clickme").live("click", function () {
alert($(this).text());
});
//从元素中删除先前用.live()绑定的所有事件.(此方法与live正好完全相反。)
$(".clickme").click(function () {
$(".clickme").die("click");
});
// $(".clickme").die("click", function () {
// alert($(this).text());
// });
});
var foo = function () {
alert($(this).text());
};
</script>
<style type="text/css">
.clickme
{ height:150px;
width:150px;
border:2px solid green;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<p id = "pBind">dddd</p>
<P id="moreEvents" ></p>
<button type="button" name="btnClick" id="btnClick" value ="Click" >Click me</button>
<p id="pOne">此事件只执行一次</p>
</div>
<div class="clickme">Please click here!</div>
<div class ="clickme">Please click another DIV!</div>
<div id ="divOver">Div moseover,please click.pain,fortunate,lucky</div>
<p id="pOut">P 標籤,鼠標移開,,mouseout ,shoot afraid ,</p>
<input id="Text1" type="text" style ="display: " />
<select id="Select1" style =" display :none">
<option></option>
</select>
</form>
</body>
</html>