用Javascript检测多个表上的点击

我开发了一个代码，可以检测用户何时单击表中的单元格，然后使用为该单元格设置的bgColor

我有我想要实现的大部分工作，我被困在如何让它检测到多个表中的点击，而不是仅仅一个。我需要将其用于多个表，但是我不能将其用于所有表，仅用于colorchartX表。因此，此页面上的其他表在单击其单元格时不应执行任何操作

因此，在下面的代码中，我让colorchart1按我所希望的方式工作，如何让colorchart2在单击其中一个单元格时进行检测，然后为该单元格提供bgColor

function getVal(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;

    var colorSelected = targ.attributes.bgcolor.value;
    alert(colorSelected);
}

onload = function() {
    var t = document.getElementById("colorchart1").getElementsByTagName("td");
    for ( var i = 0; i < t.length; i++ )
        t[i].onclick = getVal;
}


<table id="colorchart1">
<tr>
<td bgColor="#F8E0E0"></td><td bgColor="#F8ECE0"></td><td bgColor="#F7F8E0"></td><td   bgColor="#ECF8E0"></td>
<td bgColor="#E0F8E0"></td><td bgColor="#E0F8EC"></td><td bgColor="#E0F8F7"></td><td bgColor="#E0ECF8"></td><td bgColor="#E0E0F8"></td>
</tr><tr>
<td bgColor="#F5A9A9"></td><td bgColor="#F5D0A9"></td><td bgColor="#F2F5A9"></td><td bgColor="#D0F5A9"></td>
<td bgColor="#A9F5A9"></td><td bgColor="#A9F5D0"></td><td bgColor="#A9F5F2"></td><td bgColor="#A9D0F5"></td><td bgColor="#A9A9F5"></td>
</tr>
<table>

<table id="colorchart2">
<tr>
<td bgColor="#F8E0E0"></td><td bgColor="#F8ECE0"></td><td bgColor="#F7F8E0"></td><td   bgColor="#ECF8E0"></td>
<td bgColor="#E0F8E0"></td><td bgColor="#E0F8EC"></td><td bgColor="#E0F8F7"></td><td bgColor="#E0ECF8"></td><td bgColor="#E0E0F8"></td>
</tr><tr>
<td bgColor="#F5A9A9"></td><td bgColor="#F5D0A9"></td><td bgColor="#F2F5A9"></td><td bgColor="#D0F5A9"></td>
<td bgColor="#A9F5A9"></td><td bgColor="#A9F5D0"></td><td bgColor="#A9F5F2"></td><td bgColor="#A9D0F5"></td><td bgColor="#A9A9F5"></td>
</tr>
<table>

函数getVal（e）{ var targ； 如果（！e）var e=window.event； 如果（e.target）target=e.target； 如果（e.src元素）target=e.src元素，则为else； if（target.nodeType==3）//击败Safari bug target=target.parentNode； var colorSelected=target.attributes.bgcolor.value； 警报（已选择）； } onload=函数（）{ var t=document.getElementById（“colorchart1”）.getElementsByTagName（“td”）； 对于（变量i=0；i

var id=['colorchart1'，'colorchart2']；
对于（var j=0；j

或者-使用jQuery并为所有表提供一个“colorchart”类，然后使用$（'.colorchart'）选择器

var ids = ['colorchart1', 'colorchart2'];
for(var j = 0; j < ids.length; j++) {
var t = document.getElementById(ids[j]).getElementsByTagName("td");
for ( var i = 0; i < t.length; i++ )
    t[i].onclick = getVal; 
}