结构：

1、动态绑定就是给还未出现的元素绑定事件，不用每次都去执行绑定事件。

2、Jquery 1.7 之前使用 .live() 来实现动态绑定， 1.7 之后使用 .on() 来实现。

3、使用中容易出错的地方：

理解错误，总以为基于 .js_sort_up 去触发绑定。这是对动态绑定原理的不理解。以下是错误代码：

$(".js_sort_up").each(function(index, element) {
	$('.js_sort_up').on('click',function(){
		console.log('11');
		
		var selfDom = $(this).parents("div.js_rule_box");
		var prevDom = selfDom.prev('div.js_rule_box');
		if(prevDom.length < 1){
			layer.msg('已经到顶了');
		}
		var prevClone = prevDom.clone();
		selfDom.after(prevClone);			
	}
);

先理解 .on() 的原理：给动态创建的元素添加绑定事件，其实就是利于了冒泡的原理，利用DOM树中，存在的被创建元素的父亲元素或整个DOM树来，通过适配的方式，来查找创建元素并绑定事件。

通俗一些：其实是基于父原始来给下面子元素动态绑定，新增的元素也要是这个父元素里面的子元素。这样才能成功。在此次处理过程中父元素不能是新增的，切记。

正确JS：基于父元素 document （上帝视角）出发，对他的子元素 .js_sort_up（子民）进行监听。待有新子元素出生，通过Dom树原理（冒泡）反馈到 doucment （上帝） ，然后检查这个子元素是否有 .js_sort_up 来判断是否给你也这个事件。

$(function(){
	//新增规则
	$(".js_add_rule").each(function(index, element) {
		$(this).click(function(){
			var clone = $(this).parent("div").prev('div').clone();
			$(this).parent("div").before(clone);
		});
	});
	
	//动态给 .js_sort_up 增加上移事件
	$(document).on('click', '.js_sort_up', function(){				
		var selfDom = $(this).parents("div.js_rule_box");
		var prevDom = selfDom.prev('div.js_rule_box');
		if(prevDom.length < 1){
			layer.msg('已经到顶了');
		}
		var prevClone = prevDom.clone();
		selfDom.after(prevClone);
		prevDom.remove();
	});
});