javascript - url 上的回调函数？

Question

在我的网络应用程序中，我希望能够单击数据表中的 href 链接，该链接会在新页面上加载第二个表，从而过滤掉行，以便该表仅显示具有相同 id 的行我在上一个表格/页面中单击的行的 ID。

下面的代码不起作用。我相信这是因为在它有时间保存第一个表中的行数据之前，一个新的网页已经打开，并且保存数据为时已晚，因为它不再存在。有没有办法创建回调，以便在打开 href 链接之前执行我的 javascript 函数？ 或者也许我这样做完全错误？ 任何帮助将不胜感激。

Datatable.Column() 代码:(用户单击表中的图像/url 链接):

"data": "ErrorCount",
"render": function (data, type, row) {
         if (type === 'display') {
         return (data === 0)
         ? data = '<span data-search="0"></span>'
         : data = '<a id="errors" href="http://localhost/WTM/LogError/Index" type="hidden" class="fas fa-exclamation-triangle" style="color:red"></a>';
         }
         return data;
   },

Javascript过滤功能:

var clickError = document.getElementById("errors")
var xTable = $('#TABLE_ONE').DataTable();
var yTable = $('#TABLE_TWO').DataTable();

$('clickError').click(function () {
                        
     var rowData = xTable.row(this).data();                        
                        
     yTable.columns(0).search(rowData.TaskSchedulerLogUid).draw();
});

Answer 1

此处存在多个问题:

1. ID 在页面中不能重复，请使用类

2. $('clickError')选择器无效

3. 相关元素是动态呈现的，因此在代码运行时不会全部存在。使用事件委托(delegate)

4. 该行不是 <a>

修复:

HTML

'<a ̶i̶d̶=̶"̶e̶r̶r̶o̶r̶s̶"̶ class="errors"...

JS

$('#tableID').on('click', 'a.errors', function(e){
    e.preventDefault();
    var row = $(this).closest('tr')[0]; 
    var rowData = xTable.row(row).data();
    yTable.columns(0).search(rowData.TaskSchedulerLogUid).draw();

})