原生态js,鼠标按下后,经过了那些单元格的简单实例
本来是要判断那些单元格被选中，结果发现行不通，只能判断鼠标按下后，经过了那些单元格
之所以发出来，是觉得案例还有很多有意思的地方
onmouseover 的持续触发，导致了很多重复元素
由于将事件绑定在整个table上，还出现了undefined
鼠标的反复进入进出，会导致相同元素的断断续续的重复，
如何解决他们！
<tableborder="1"id="dnf"> <tr> <tdrowspan="2">2</td> <td>2</td> <td>4</td> </tr> <tr> <td>2</td> <td>4</td> </tr> </table>
window.onload=function()
{
varflag=false;<BR>//当鼠标被按下时，为true,放开是为true
varindexs=[];<BR>//用来存放鼠标经过的单元格在整个表格的位置，鼠标按下时被初始化，
dnf.onmousedown=function()
{
flag=true;
indexs=[];
}
dnf.onmousemove=function(e)
{
if(flag)//只有鼠标被按下时，才会执行复合代码
{
indexs.push(search(e.target,dnf.getElementsByTagName("td")))
}
}
dnf.onmouseup=function()
{
flag=false;
deleteUndefined();//由于会经过边框，所以会出现null元素
deleteRepaint();//由于onmouseover不会只触发一次，且我们选择是可能反复经过一个单元格
alert(indexs);
}
functiondeleteRepaint()
{
for(varj=0;j<indexs.length;j++)//保证第j个元素是唯一的
{
varhead=indexs[j];
for(vari=j+1;i<indexs.length;i++)//删除与第j个重复的
{
if(head==indexs[i])
{
indexs.splice(i,1);
i--;
}
}
}
}
functiondeleteUndefined()
{
for(vari=0;i<indexs.length;i++)
{
if(typeofindexs[i]=="undefined")
{
indexs.splice(i,1);
i--;
}
}
}
functionsearch(a,A)
{
varlength=A.length;
for(vari=0;i<length;i++)
{
if(a==A[i])
{
returni;
}
}
}
}
</script>
以上这篇原生态js,鼠标按下后,经过了那些单元格的简单实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。