//這是ife2015的題目，點(diǎn)擊列表，控制臺(tái)彈信息；點(diǎn)擊按鈕后，列表內(nèi)容改變，所以需要delegate事件委托，可是封裝進(jìn)$1方法后就提示錯(cuò)誤？
//還有就是$對(duì)象是捕獲id的，$1對(duì)象是添加事件處理程序的，題目要求整合到一起，可是想了好久不懂，才起了$和$1?
<!DOCTYPE?html>
<html>
<head>
<meta?charset="utf-8">
<title>事件代理</title>
</head>
<body>
<ul?id="list">
<li?id="item1">Simon</li>
<li?id="item2">Kenner</li>
<li?id="item3">Erik</li>
</ul>
<button?id="btn">change</button>
<script?type="text/javascript">
//處理函數(shù)
function?clickListener(event)?{????????//點(diǎn)擊列表li項(xiàng)
??? console.log(event);
}
function?renderList()?{????????????//點(diǎn)擊改變li項(xiàng)內(nèi)容
??? $("#list").innerHTML?=?'<li>new?item</li>';
}
//?僅能根據(jù)id捕獲dom的封裝
function?$(selector){
if?(selector.substr(0,1)?==?"#")?{
var?getDom?=?document.getElementById(selector.substring(1));
return?getDom;
}?else{
console.log("This?is?not?a?id");
}
}
//事件封裝
var?$1?=?{????????????????????????????????????????????????????????//如何把$和$1整合？？？？
on:?function(element,?event,?listener){????????//添加事件處理程序
element.addEventListener(event,listener);
},
un:?function(element,?event,?listener){????????//移除事件處理程序
element.removeEventListener(event,listener);
},
click:?function(element,?listener){????????????????//添加click事件處理程序
element.addEventListener("click",?listener);
},????
enter:?function(element,?listener){????????????????????//添加enter事件處理程序
element.addEventListener("keyup",?function(event){
???? var?event?=?event???event?:?window.event;
???? if?(event.keyCode?==?13)?{
???? listener(); //先判斷是否為enter再調(diào)用
???? };
??? })
}
delegate:?function(element,?tag,?eventName,?listener){
$1.on(element,?eventName,?function(){ //不直接將此function指定為listener，先檢測(cè)tagName是否為li
event?=?event?||?window.event;
var?target?=?event.target?||?event.srcElement;
if?(target.tagName?==?tag.toUpperCase())?{ //?element.tagName得到元素標(biāo)簽名（大寫）
listener(event);
}
});
}
}
$1.click($("#btn"),?renderList);????//點(diǎn)擊切換li內(nèi)容
$1.delegate($("#list"),?"li",?"click",?clickListener);
</script>
</body>
</html>
javascript為什么把事件代理方法封裝到$1對(duì)象后，提示Unexpected identifier？
newsudhc3634140
2016-09-23 15:53:13