事件委托获取点击元素的索引

最新推荐文章于 2022-06-04 15:57:54 发布

原创最新推荐文章于 2022-06-04 15:57:54 发布 · 4.9k 阅读

1 ·

CC 4.0 BY-SA版权

本文介绍如何使用JS和AJAX生成动态表格，并通过点击事件获取按钮索引，将所需参数传递到详情页。作者在生成按钮时添加了特定属性，成功解决了参数传递的问题。

首先我用js ajax返回的数据在页面上生成了一个表格，表格每行里有一个按钮查看详情，点击查看详情跳到详情页，但是要传参数，就要获取点击按钮的索引。这个问题查了一下午没查到，最后咋解决的，请往下看。。。。

$("body").on("click", ".td-btn", function (event) {
    // console.log(alldata)
    // console.log(event.target)
    num = $(event.target).attr('data-id')
    var filename = alldata.similar_functions[num].function_file_name
    var functionname = alldata.similar_functions[num].function_name
    window.open("detail?name1=" + encodeURI(filename) + "&name2=" + encodeURI(functionname))
  })

我是生成查看详情按钮的时候，给他添加了一个属性，获取值，这样就可以轻松的获取到了。

append($('<button>').html('查看详情').addClass('td-btn').attr('data-id',idx))