jQuery动态添加多个元素后，绑定事件全部触发的解决办法

这个解决办法非常简单，而且我也深深地意识到这篇文章不会写太长，因为真的很简单。

首先来看一下例子：

for (var i = 0; i < 5; i++) {
								$tr += "<tr>" + "<td>" + (i + 1) + "</td>"
										//此处是非关键代码
											+ "<td>"
											+ "<input type='button' name='paySinglePchsSheet' class='paySinglePchsSheet'"
											+ " value='付款'/>"
											+ "</td>";
									$("#forPchsAcctSection").on(
											"click",
											paySinglePchsSheet);
								}
								$tr += "</tr>";
							}
							$goodsTable.empty();
							$goodsTable.append($tr);
function paySinglePchsSheet() {
							alert("单笔付款");
						}

代码中动态添加了一个button，并且给这个button绑定了一个click事件，for循环执行五次，所以是添加了五个绑定有click事件的button按钮。当我产点击付款的时候，会发现Duang Duang Duang弹出五次单笔付款的alert()来，这里是用alert()用测试。而真正的业务不可能是这样，明明是单笔付款，Duang Duang Duang付了五次，那老板哭了。
把代码写成下面这样，用id去指定一下（id也是动态生成的）。

for (var i = 0; i < 5; i++) {
								$tr += "<tr>" + "<td>" + (i + 1) + "</td>"
										//此处是非关键代码
											+ "<td>"
											+ "<input type='button' name='paySinglePchsSheet' class='paySinglePchsSheet'"
											+ "id=pay"+i
											+ " value='付款'/>"
											+ "</td>";
									$("#forPchsAcctSection").on(
											"click",
											"#pay"+i,
											paySinglePchsSheet);
								}
								$tr += "</tr>";
							}
							$goodsTable.empty();
							$goodsTable.append($tr);

这样就生成了id为pay1 pay2 pay3 pay4 pay0的五个button，并且在绑定事件的时候对触发事件的元素进行了委托，这时候再点击付款，就会发现只弹出一次。突然心里好高兴的样子。
大家还在以把测试代码改成alert($(this).attr("id"));来验证一下是不是你点击的那个button。
完了，是不是很简单。