先分享一個不能實現的實例(因為es5沒有塊作用域)
for(var i=0; i<list.length; i++ )
{
list[i].onclick = function(){
tabchange(i);
}
}
解決方案:
1.es6新的變量聲明方式 let(es6具有塊級作用域,解決es5存在的問題)
for(let i=0; i<list.length; i++ )
{
list[i].onclick = function(){
tabchange(i);
}
}
2.利用閉包
for(var i=0; i<list.length; i++ )
{
list[i].onclick = (function(){
return function(){
tabchange(i);
}
})(i);
}
3.為元素對象創建對應的索引
for(var i=0; i<list.length; i++ )
{
list[i].myindex=i;
list[i].onclick = function(){
tabchange(this.myindex);//綁定元素對應的索引
}
}
//這種方案一般也用於輪播圖,當然是用框架就不用考慮這么多問題了