Question

我实际上需要从服务url生成动态表，然后生成动态表。这是我解决了但我想要的是

如何使用click事件在每个表行上生成动态按钮。
生成按钮后我们如何将点击事件分配给按钮我的意思是在表格中有四列，如日期，ID号，名称，位置以及点击每列或者与该单元格相关，它必须重定向到新页面。

或

如果点击了表格行，并且有4列，例如日期，ID号，名称，位置，则点击事件会将日期作为参数并单击事件功能，然后它必须进入下一页/重定向

$('#btn_Day').click(function () { 

var ex = document.getElementById("dpp_info");
var clOptions = ex.options[ex.selectedIndex].value;
var clOptions1 = ex.options[ex.selectedIndex].text;

var dt = todaydate;
var dt1 = todaydate;

$.ajax({
    type: 'GET',
    url: xxxxx.xxxxx.xxxxx,
    data: frmDate_=" + dt + "&toDate_=" + dt1 + "",

    success: function (resp) {

        var Location = resp;

        var tr;        

        for (var i = 0; i < Location.length; i++) {

            tr = tr + "<tr>";
             tr = tr + "<td  style='height:20px' align='left'>" + Location[i].Name + "</td>";
            tr = tr + "<td  style='height:20px' align='left'>" +  Location[i].Date + "</td>";
             tr = tr + "<td style='height:20px' align='left'>" + Location[i].IdNum + "</td>";


            tr = tr + "</tr>";

        };

        document.getElementById('Wise').innerHTML = "<table class='r'>" + "<tr><thead ><th  style='height:20px'>Location</th>"
        + "<th  style='height:20px'>Date</th>" + "<th  style='height:20px'>Id Num</th>" + "</tr></thead>"
        + tr +
        "<tr></tr>" +
        "</table>";
        document.getElementById('Wise').childNodes[0].nodeValue = null;

    },
    error: function (e) {

        window.plugins.toast.showLongBottom("Please Enable your Internet connection");

    }
});
});

现在在图像中，如果你看到有四列，假设我点击了idnumb并且那里有与该特定号码相关的记录必须在单独的页面中显示

寻求帮助！

Answer 1

在对此进行更多讨论后，关键是只使用处理程序并使用属性传递任何值。你可以在这里看到小提琴

https://jsfiddle.net/p2fpbkuo/3/

$('.button-click').off();
$('.button-click').on('click', function () {
    // navigate to new page
 // console.log('button click')

 // what you could do here is get the serialnumber which is an attribute on the button 
 var id = $(this).attr('data-id') // as long as this is unique this should always work

 var filteredResults = results.filter(function (result) {
  if (result.SerialNumber.toString() === id.toString()) {
    return result;
  }
});

var selectedRowValues = filteredResults[0];

// this will contain all the values for that row
console.log(selectedRowValues)

 // var dataValue = $(this).attr('data-url'); // dont't need this any more
 window.open(selectedRowValues.Url)
});

如何在表格行中生成动态按钮并在按钮单击时打开新页面

1 个答案: