递归绑定法(recursive binding)。jQuery里的.bind()方法，其实是一种对事件处理的通用写法。
例如点击事件：.click(), 可以写成.bind(‘click’)。而.unbind()，顾名思义就是解除事件处理。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>jQueryPad Preview</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-git.js"></script>
<style type="text/css">
body
{
font-family: Segoe UI;
font-size: 10pt;
background: white;
}
</style>
<script type="text/javascript">
function addItem() {
$('#list1 li button')
.unbind('click')//解除click事件
.bind('click', function(){
var $newLi = $('<li><button>新按钮</button></li>');
$(this).parent().after($newLi);
addItem();//使用递归函数重新赋值
});
}
$(document).ready(function() {
addItem();
// 以下是原始事件绑定
$('#list1 li button').click(function() {
$(this).after('原始绑定');
});
});
</script>
</head>
<body>
<div>
<ul id="list1">
<li>非按钮 </li>
<li><button>点击我</button> </li>
</ul>
</div>
</body>
</html>
通过上面的演示，你可能发现一个问题：点击最初的按钮，你没有看到“原始绑定”这几个字别加在按钮后面。
虽然在代码里，我定义了原始事件捆绑，但是在递归函数addItem()里，这原始事件被解除(unbind)了。
如何让unbind函数只解除新的事件而保留原始事件呢。其中一种办法是，使用“命名空间”（namespacing）
function addItemNS() {
$('#list2 li button')
.unbind('click.addit')//这里加上了addit，建立命名空间
.bind('click.addit', function() {
var $newLi = $('<li > <button>新按钮</button></li>');
$(this).parent().after($newLi);
addItemNS();
});
}
$(document).ready(function() {
addItemNS();
//原始事件捆绑
$('#list2 li button').click(function() {
$(this).after('原始捆绑');
});
});