1. 程式人生 > >js/jQuery繫結將來生成的事件

js/jQuery繫結將來生成的事件

HTML

<button class="num1">點選生成按鈕</button>
<div class="newbtn" id="newparent" style="width: 400px;height: 80px;border: 1px solid red;"></div>

js/jQuery

$('.num1').click(function(){
		$('.newbtn').html("<button class='num2' id='newnum2'>點選</button>");
});
$('.outerclick').on('click','.innerclick',function(event){
	event.stopPropagation();  // 防止冒泡到外層的點選事件
	alert("內部的繫結事件");
});

//js
document.getElementById('newparent').addEventListener("click",function(event){
		var event = event || window.event;
			event.stopPropagation();
		var target = event.target || event.srcElement;
			alert(target.tagName);
		if(target.tagName === "BUTTON"){
				alert(target.className);//target.classList 根據這些值判斷來寫處理的事件即可
				alert("未來事件繫結");
		}					
	})