javascript - 如何为通过 java 脚本动态创建的 HTML 表格行放置一个 onclick 事件。？

Question

我是 javascript 新手。

谁能帮我在点击通过 javascript 创建的 HTML 表格行时实现 onclick 事件？

请注意，我使用 innerHTML 在表格单元格中插入数据。下面是我尝试过的代码片段。？

Java 脚本函数:

function addRow(msg)
{
    var table = document.getElementById("NotesFinancialSummary");
    var finSumArr1 = msg.split("^");
    var length = finSumArr1.length-1;
    alert("length"+ length);
    for(var i=1; i<finSumArr1.length; i++)
    {
        var row = table.insertRow(-1);
        var rowValues1 = finSumArr1[i].split("|");
        for(var k=0;k<=10;k++)
        {       
            var cell1 = row.insertCell(k);
            var element1 = rowValues1[k];
            cell1.innerHTML = element1;     
        }   


    }

        for(var i=1; i<rowCount; i++)
        {
            for(var k=0;k<=10;k++)
            {   
                document.getElementById("NotesFinancialSummary").rows[i].cells[k].addEventListener("click", function(){enableProfileDiv()}, false);


            }
        }       

}

jsp 中的 HTML 表格代码:

     <TABLE id="NotesFinancialSummary" width="800px" border="1" align="left" >
<tr >

                <th>Symbol</th>
                <th>Claimant</th>
                <th>MJC</th>
                <th>S</th>
                <th>Type</th>
                <th>Indemnity Resv</th>
                <th>Indemnity Paid</th>
                <th>Medical Resv</th>
                <th>Medical Paid</th>
                <th>Legal Resv</th>
                <th>Legal Paid</th>
     </tr>
      <tr>
                    <td>
                    </td>
                    <TD> </TD>          
                    <TD> </TD>
                    <TD> </TD>          
                    <TD> </TD>
                    <TD> </TD>          
                        <TD> </TD>
                        <TD> </TD>  
                        <TD> </TD>  
                        <TD> </TD>  
                        <TD> </TD>  
        </tr>



    </table>

Answer 1

<table id="table"></table>

$("#table").append("<tr><td>Hi there</td></tr>");

$("#table").on( "click", "tr", function(){
    // do something
    alert( $(this).children("td:first").text() );
});

任何时候click事件冒泡到 <table id="table"> ，将调用此函数(无论 <tr> 是动态插入还是硬编码)。

这将需要 jQuery 库

• http://jquery.com/
• http://api.jquery.com/on/