在 html 表格中選擇一行

Question

我正在嘗試在我創建的表中選擇一行並需要使用這些值。 我遇到的問題是我使用 javascript 中的 dom 創建它並從存儲過程中獲取值，然后填充表。

所以我使用了一個帶有 id 的簡單 div -

 <div id="Tab1" class="tab-pane fade in active"></div>      

要創建表並填充它，我使用 ajax 調用 -

function GetcarData() {

$.ajax({
    type: "post",
    data: JSON.stringify({
        price: slidval,
    }),
    url: "/index.aspx/GetData",
    dataType: "json",
    contentType: "application/json",
    success: function (object) {
        responseData(object);
    },
    complete: function (object) {

    },
    error: function (object) {
    }
});
}
function responseData(object) {
    var stringed = JSON.stringify(object.d)
    var arr = JSON.parse(stringed);
    var i;
    var out = "<table id='table' class='table table-striped'>";
    var rowHeader = $("<tr></tr>").appendTo(out);
    out += "<td><font size='4'>Make</font></td>";
    out += "<td><font size='4'>Model</font></td>";
    out += "<td><font size='4'>Version</font></td>";
    out += "<td><font size='4'>Engine</font></td>";       
    out += "<td><font size='4'>(AV)Price new</font></td>";
    out += "<td><font size='4'>(Av)Price used</font></td>";
    out += "<td><font size='4'>Image</font></td>"

    for(i = 0; i < arr.length; i++) {
        out += "<tr><td>" + 
        arr[i].Make +
        "</td><td>" +
        arr[i].Model +
        "</td><td>" +
        "£" + arr[i].version +
        "</td><td>"+
          arr[i].Engine_size +           
        "</td><td>" +           
        "£" + arr[i].price_new +
        "</td><td>" +
         "£" + arr[i].price_used +
          "</td><td><img src="+arr[i].image_url+" width='150' height='100'>" +             
        "</td></tr>";
    }
    out += "</table>";
    document.getElementById("Tab1").innerHTML = out;

}

現在我遇到的問題是我似乎無法選擇一行。 我試過

("#table tr").click(function(){
alert("selected");
});

但這沒有用。

任何幫助，將不勝感激

Answer 1

您創建了一組在頁面時不在 DOM 中並且僅在初始DOMContentLoaded之后添加的元素

要偵聽通過 JavaScript DOM 操作動態添加和刪除的元素上的事件，您需要使用稍微不同的event偵聽器。

$(document).on('%eventName%', '%selector%', function() { // do your stuff });