jQuery链式语法 用js生成页面 并且响应click事件
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="js.aspx.cs" Inherits="MYERP.js" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.panel{
padding:60px;
background-color:red;
color:#FFFFFF;
font-size:50px;
font-weight:bold;
width:600px;
text-align:center;
}
</style>
<script type="text/javascript" src="JqueryCode/jquery-1.8.0.js"></script>
<script type="text/javascript">
$(function () {
//向页面中添加几个按钮
$('<input type="button" value="click me"/><input type="button" value="triggle click me"/><input type="button" value="detach handler"/><input type="button" value="show/hide text"/>').appendTo($('body'));
//将四个按钮分别绑定四个不同的事件处理函数
$('input[type="button"]').eq(0).click(function () {
alert('you clicked me');
}).end().eq(1).click(function () {
$('input[type="button"]:eq(0)').trigger('click');
}).end().eq(2).click(function () {
$('input[type=button]:eq(0)').unbind('click');
}).end().eq(3).toggle(function () {
$('.panel').hide('slow');
}, function () {
$('.panel').show('slow');
});
});
</script>
</head>
<body style="text-align:center">
<form id="form1" runat="server">
<div style="text-align:center">
<div class="panel">Welcome to jQuery!</div>
</div>
</form>
</body>
</html>
