js 绑定带参数的事件以及手动触发事件

1.html代码

<div> 
<div id="tab"> 
<h2>标题一</h2> 
<h2>标题二</h2> 
<h2>标题三</h2> 
<h2>标题四</h2> 
div> 
<dl id="tabcon"> 
<dd>内容一</dd> 
<dd>内容二</dd> 
<dd>内容三</dd> 
<dd>内容四</dd> 
</dl> 
<div>

2 .js部分

<script type="text/javascript" defer="defer"> 
var tab = document.getElementById("tab").getElementsByTagName("h2"); 
function swap(n) { 
return function() { 
for(var i=0; i<tab.length; i++) { 
document.getElementById("tabcon" + i).style.display = "none"; 
document.getElementById("tab" + i).className = ""; 
} 
document.getElementById("tabcon" + n).style.display = "block"; 
document.getElementById("tab" + n).className = "focus"; 
} 
} for(var i=0; i<tab.length; i++) { 
tab[i].setAttribute("id", "tab" + i); 
if(window.addEventListener) { 
tab[i].addEventListener("mouseover", swap(i), false); 
} else if(window.attachEvent) { 
tab[i].attachEvent("onmouseover", swap(i)); 
} 
} 
var tabcon = document.getElementById("tabcon").getElementsByTagName("dd"); 
for(i=0; i<tabcon.length; i++) { 
tabcon[i].setAttribute("id", "tabcon" + i); 
} 
if(document.createEvent) { 
var evObj = document.createEvent('MouseEvents'); 
evObj.initEvent( 'mouseover', true, false); 
tab[0].dispatchEvent(evObj); 
} else if( document.createEventObject) { 
tab[0].fireEvent('onmouseover'); 
} 
</script>