系统:XP IE6小弟想在表格中动态插入一行或一列,但运行时提示“对象不支持此属性或方法”请问是什么原因?
错误就发生在InsertRow及下面几个函数中。<!--实现右键菜单功能--><html>    <body oncontextmenu = showMenu()>            <table   border="1"   cellspacing="0"   cellpadding="0" width="50%">   
            <tr><td>11</td><td>12</td><td>13</td><td>14</td></tr>   
            <tr><td>21</td><td>22</td><td>23</td><td>24</td></tr> 
            </table>
    </body>    
    <!-- 这里用来定义需要显示的右键菜单 -->    <div id="itemMenu" style="display:none">           <table border="1" width="100%" height="100%" bgcolor="#dcdcdc" style="border:thin" cellspacing="0">                  <tr>
                      <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.InsertRow()">
                      插入一行
                      </td>
                  </tr>                  <tr>
                     <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.InsertCol();">
                      插入一列
                      </td>
                  </tr>                  <tr>
                      <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.DelRow()">
                      删除该行
                      </td>
                  </tr>                  <tr>
                      <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.DelCol()">
                      删除该列
                      </td>
                  </tr>
           </table>
    </div>
    <!-- 右键菜单结束-->
</html>
<script language="JavaScript">
<!---全局变量->
var tableObj;
var RowID;
var ColID;<!--显示右键菜单-->
function showMenu()
{
    if(event.srcElement.tagName == "TD" || event.srcElement.tagName == "TH")   
    {   
        tableObj = event.srcElement.parentElement; 
        RowID = event.srcElement.parentElement.rowIndex; 
        ColID = event.srcElement.cellIndex; 
        popMenu(itemMenu,100);
        event.returnValue=false;
        event.cancelBubble=true;
    }
    else
    {
        event.returnValue=true;
        event.cancelBubble=false;
    }
    return false;
}
<!--显示弹出菜单menuDiv:右键菜单的内容width:行显示的宽度-->function popMenu(menuDiv,width)
{
    //创建弹出菜单
    var pop=window.createPopup();
    //设置弹出菜单的内容
    pop.document.body.innerHTML=menuDiv.innerHTML;    var rowObjs=pop.document.body.all[0].rows;    //获得弹出菜单的行数
    var rowCount=rowObjs.length;    //循环设置每行的属性
    for(var i=0;i<rowObjs.length;i++)
    {
        rowObjs[i].style.display="";        //设置鼠标滑入该行时的效果
        rowObjs[i].cells[0].onmouseover=function()
        {
            this.style.background="#0080ff";
            this.style.color="white";
        }        //设置鼠标滑出该行时的效果        rowObjs[i].cells[0].onmouseout=function()
        {            this.style.background="#dcdcdc";            this.style.color="black";
        }
    }//end for    //屏蔽菜单的菜单
    pop.document.oncontextmenu=function()
    {
            return false;
    }    //选择右键菜单的一项后,菜单隐藏
    pop.document.onclick=function()
    {
            pop.hide();
    }    //显示菜单
    pop.show(event.clientX-1,event.clientY,width,rowCount*25,document.body);
    return true;
}<!--弹出式菜单项的回调函数-->
/*弹出式菜单项的回调函数*/function InsertRow()
{
    tableObj.insertRow(RowID+1);
}function InsertCol()
{
    for(var i=0;i<tableObj.rows.length;i++)
    {
       tableObj.rows[i].insertCell(ColID+1); 
    }
}function DelRow()
{
    tableObj.deleteRow(RowID);
}function DelCol()
{
    for(var i=0;i<tableObj.rows.length;i++)
    {
       tableObj.rows[i].deleteCell(ColID); 
    }
}</script>

解决方案 »

  1.   

    <div id="itemMenu" style="display:none">           <table border="1" width="100%" height="100%" bgcolor="#dcdcdc" style="border:thin" cellspacing="0">                  <tr>
                          <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.InsertRow()">
                          插入一行
                          </td>parent对象是tr,tr没有insertRow函数,而且你的大小写也不对,下面的同理                  </tr>                  <tr>
                         <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.InsertCol();">
                          插入一列
                          </td>
                      </tr>                  <tr>
                          <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.DelRow()">
                          删除该行
                          </td>
                      </tr>                  <tr>
                          <td style="font-size:13px;cursor:default;border:outset 1;" align="center" onclick="parent.DelCol()">
                          删除该列
                          </td>
                      </tr>
               </table>
        </div>
      

  2.   

    各位老大:
    InsertRow及其它几个函数都确实被调用了,问题出在InsertRow函数内部。继续求教!
      

  3.   

    function showMenu()
    {
        if(event.srcElement.tagName == "TD" || event.srcElement.tagName == "TH")   
        {   
            tableObj = event.srcElement.parentElement
            RowID = event.srcElement.parentElement.rowIndex; 
            ColID = event.srcElement.cellIndex; 
            popMenu(itemMenu,100);
            event.returnValue=false;
            event.cancelBubble=true;
        }
        else
        {
            event.returnValue=true;
            event.cancelBubble=false;
        }
        return false;
    }调试下看看全局变量是不是table对象,只有table对象才有insertRow()这个方法。
    如果事件源为td,那么table对象应该是
    event.srcElement.parentElement.parentElement.parentElement
    td>tr>tbody>table
      

  4.   

    tableObj = event.srcElement.parentElement.parentElement; 
      

  5.   

    感谢各位回贴帮助!
    使用tableObj = event.srcElement.parentElement.parentElement.parentElement; 获得了成功!