jQuery：來自ajax的表數據的dialog（）未顯示

Question

$(function () {
    $('.referral').on('click', function () {
        $('#hold').html($(this).find('DIV').html());
        $('#hold').dialog();
    });
});

$(function getTableData() {
    $.ajax({
        url: 'interface_API.php',
        data: "",

        dataType: 'json',
        success: function (data) {
            setTimeout(function () {
                getTableData()
            }, 1000);
            var body = document.getElementById('tbody');
            body.innerHTML = '';
            for (var i in data) {
                var row = data[i];
                var customerCode = row.CustomerCode;
                var phone = row.PhoneNumber;
                var thetime = row.TimeStamp;

                var tr = document.createElement('TR');
                tr.className += " " + "referral";
                body.appendChild(tr);

                var td = document.createElement('TD');
                td.appendChild(document.createTextNode(customerCode));
                tr.appendChild(td);

                var td = document.createElement('TD');
                td.appendChild(document.createTextNode(phone));
                tr.appendChild(td);

                var td = document.createElement('TD');
                td.appendChild(document.createTextNode(thetime));
                tr.appendChild(td);

                var tr2 = document.createElement('TR');
                body.appendChild(tr2);

                var td2 = document.createElement('TD');
                var divE = document.createElement('DIV');
                divE.className += " " + "extra";
                var text = document.createTextNode("sage, extra, etc");
                divE.appendChild(text);
                td2.appendChild(divE);
                tr2.appendChild(td2);
            }

        }
    });
});

我有使用ajax導入的JSON api中的數據。 這顯示在一個表中，其中的行是使用JS創建的。

在每一行中，都有對用戶隱藏的另一行“其他”數據。 在單擊一行時，我希望出現一個顯示此“其他”數據的對話框。

最初，我嘗試通過寫出“原始格式”的行來完成此操作（ var row = "<tr><td>...</td></tr>"等），但是我讀到這不適用於像我正在嘗試執行的javascript函數那樣，因為DOM已經設置（我對此不是100％肯定）。 這就是為什么在某些方面我使用JS創建每個元素並正確執行的原因。

但是 ，我仍然無法顯示對話框

筆記。 表格下方（硬編碼html）是一個空的div，用作出現對話框時的保持器。

在數據靜態和不涉及Ajax之前，我已經取得了成功

Answer 1

我找到了解決方案。 似乎未調用JS .on('click', function()或在正確的位置進行注冊。我使用chrome dev工具檢查了DOM屬性，而.referral的onclick屬性為null。

相反，我使用函數clicks()設置每個<TR>的onclick屬性，如下所示：

var tr = document.createElement('TR');
tr.setAttribute("onclick", "clicks(this)");

與，

function clicks(param){
        $('#hold').html($(param).find('DIV').html());
        $('#hold').dialog();
};