Javascript 如何从动态表中获取数据

我有一个动态表，我需要在脚本中的任何位置从中获取日期

桌子

$('#update_panel').html('Loading Date....');

$.ajax({
    url: '/Home/GetCountries',
    type: 'GET',
    datatype: 'Json',
    success: function (data) {
        if (data.length > 0) {
            var $data = $('<table></table>').addClass('table table-responsive table-striped');
            var header = "<thead><tr><th>Country ID</th><th>Country</th></tr></thead>";
            $data.append(header);

            $.each(data, function (i, row) {
                var $row = $('<tr/>');
                $row.append($('<td/>').html(row.CountryId));
                $row.append($('<td/>').html(row.CountryName));
                $row.append($('<td/>').html("<a href='/home/Save/" + row.CountryId + "' class='popup'>Edit</a>&nbsp;|&nbsp;<a href='/home/Delete/" + row.CountryId + "' class='popup'>Delete</a>"));
                $data.append($row);
            });

            $('#update_panel').html($data);
        }

如何到达Dom中的表

---

提前感谢

您的表似乎没有id

#mytable

。更改

$（“#mytable tr”）。单击（函数（）{

进入：

$('#update_panel').on('click','.table tr',function () {...});

或者简单地将id

#mytable

添加到表中

 $('<table id="myTable"></table>')

---

以下是一些观察结果和可能的解决方案：

• 您的动态表缺少ID（mytable）
• 添加后，您的代码应该可以正常工作。请参阅下面的代码

var数据=[]；
var row1={}；
行1.CountryId=“100”；
row1.CountryName=“美国”；
数据推送（第1行）；
var row2={}；
row2.CountryId=“101”；
row2.CountryName=“德国”；
数据推送（第2行）；
如果（data.length>0）{
var$data=$（''）.addClass（'table responsive table striped'）；
var header=“Country IDCountry”；
$data.append（表头）；
$。每个（数据、函数（i、行）{
变量$row=$（''）；
$row.append（$（''）.html（row.CountryId））；
$row.append（$（''）.html（row.CountryName））；
$row.append（$（''）.html（“|”）；
$data.append（$row）；
});
$（'update#panel'）.html（$data）；
}
$（“#mytable tr”）。单击（函数（）{
var countryId=$（this.find（'td'）.eq（0.text（）.trim（）；
警报（countryId）；
})；

$.ajax({
url:“/Home/GetCountries”，
键入：“GET”，
数据类型：“Json”，
成功：功能（数据）
{
如果（data.length>0）
{
//在这里，我已将“id”属性应用于表
var$data=$（''）.addClass（'table responsive table striped'）；
var header=“Country IDCountry”；
$data.append（表头）；
$。每个（数据、函数（i、行）
{
变量$row=$（''）；
$row.append（$（''）.html（row.CountryId））；
$row.append（$（''）.html（row.CountryName））；
$row.append（$（''）.html（“|”）；
$data.append（$row）；
});
$（'update#panel'）.html（$data）；
}
}
});
//要在动态DOM上触发事件时，请使用“on”事件
$（“#更新#面板”）。在（“单击”，“我的表格tr”，函数（）
{
//它将选择单击的“tr”元素的所有“td”子元素。
//然后我们使用了.first（），因此它将只选择第一个“td”元素
var countryId=$.trim（$（this.children（“td”）.first（）.text（））；
警报（countryId）；
});

谢谢Vimalan，它正在工作，但我如何使用$（“#mytable tr”）。单击（函数（）{var countryId=$（this）。查找（'td'）。eq（0）。text（）.trim（）；alert（countryId）；}）；在表函数外的不同位置…类似于函数GenerateTable（）{var$data=$（''）之类的内容，并在我想要使用的不同位置$(“#mytable tr”）。单击（函数（）{var countryId=$（this）。查找（'td'）.eq（0）。text（）.trim（）；警报（countryId）；}）；将事件处理程序放入函数中，并在GenerateTable（）之后调用它

 $('<table id="myTable"></table>')

$('#update_panel').on('click','#mytable tr',function () {...});

   $.ajax({
                url: '/Home/GetCountries',
                type: 'GET',
                datatype: 'Json',
                success: function (data)
                {
                    if (data.length > 0)
                    {
                        // HERE I HAVE APPLIED 'id' ATTRIBUTE TO TABLE
                        var $data = $('<table id="mytable"></table>').addClass('table table-responsive table-striped');
                        var header = "<thead><tr><th>Country ID</th><th>Country</th></tr></thead>";
                        $data.append(header);
                        $.each(data, function (i, row)
                        {
                            var $row = $('<tr/>');
                            $row.append($('<td/>').html(row.CountryId));
                            $row.append($('<td/>').html(row.CountryName));
                            $row.append($('<td/>').html("<a href='/home/Save/" + row.CountryId + "' class='popup'>Edit</a>&nbsp;|&nbsp;<a href='/home/Delete/" + row.CountryId + "' class='popup'>Delete</a>"));
                            $data.append($row);
                        });
                        $('#update_panel').html($data);
                    }
                }
            });
            //USE 'on' EVENT WHEN YOU WANT TO TRIGGER EVENT ON DYNAMIC DOM
            $("#update_panel").on("click", "#mytable tr", function ()
            {
                // IT WILL SELECT ALL 'td' CHILDREN OF CLICKED 'tr' ELEMENT.
                // THEN WE USED .first() SO IT WILL SELECT ONLY FIRST 'td' ELEMENT
                var countryId = $.trim($(this).children("td").first().text());
                alert(countryId);
            });