【发布时间】：2019-09-12 07:12:05
【问题描述】：
我正在使用"jquery": "^3.4.0" 和DataTables 1.10.18。
我有下表：
$(document).ready(() => {
var table = $('.datatable-responsive').DataTable();
});
$("#edit-row").click(() => {
var c = this.id
console.log(c)
});<!DOCTYPE html>
<html lang="en">
<head>
<!-- Global stylesheets -->
<link href="https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700,900" rel="stylesheet" type="text/css">
<link href="https://gitcdn.link/repo/marcpre/demo_cryptoscreener/master/_other/layout_html/global_assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
<link href="https://gitcdn.link/repo/marcpre/demo_cryptoscreener/master/_other/layout_html/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<!-- /global stylesheets -->
<!-- Core JS files -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.2.1/js/bootstrap.bundle.min.js"></script>
<!-- /core JS files -->
<!-- Load plugin -->
<script src="https://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
<!-- /load plugin -->
<!-- Theme JS files -->
<script src="https://gitcdn.link/repo/marcpre/demo_cryptoscreener/master/_other/layout_html/global_assets/js/plugins/sliders/ion_rangeslider.min.js"></script>
<script src="https://gitcdn.link/repo/marcpre/demo_cryptoscreener/master/_other/layout_html/global_assets/js/plugins/ui/moment/moment_locales.min.js"></script>
</head>
<body class="navbar-top">
<!-- Page content -->
<div class="page-content pt-0">
<!-- Default ordering -->
<div class="card">
<div class="card-body">
<table class="table datatable-responsive dataTable" style="width:100%">
<thead>
<tr>
<th>#</th>
<th>Status</th>
<th>Title</th>
<th>Image</th>
<th>Profile</th>
<th class="text-center">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td>-2</td>
<td><span class="badge badge-success">Posted</span></td>
<td>Awesome Post</td>
<td><img src="./assets/img/baby.jpg" alt="" srcset="" style='width:20%;'></td>
<td>Joe</td>
<td class="text-center">
<div class="list-icons">
<div class="dropdown">
<a href="#" class="list-icons-item" data-toggle="dropdown">
<i class="icon-menu9"></i>
</a>
<div class="dropdown-menu dropdown-menu-right">
<a href="#" id="edit-row" class="dropdown-item"><i class="icon-pencil"></i> Edit</a>
<a href="#" class="dropdown-item"><i class="icon-bin"></i> Delete</a>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>99</td>
<td><span class="badge badge-secondary">Queued</span></td>
<td>Cool Post</td>
<td><img src="./assets/img/diy.jpg" alt="" srcset="" style='width:20%;'></td>
<td>Brad</td>
<td class="text-center">
<div class="list-icons">
<div class="dropdown">
<a href="#" class="list-icons-item" data-toggle="dropdown">
<i class="icon-menu9"></i>
</a>
<div class="dropdown-menu dropdown-menu-right">
<a href="#" id="edit-row" class="dropdown-item"><i class="icon-pencil"></i> Edit</a>
<a href="#" class="dropdown-item"><i class="icon-bin"></i> Delete</a>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>10</td>
<td><span class="badge badge-secondary">Queued</span></td>
<td>Awesome Post</td>
<td><img src="./assets/img/infographic.jpg" alt="" srcset="" style='width:20%;'></td>
<td>Tom</td>
<td class="text-center">
<div class="list-icons">
<div class="dropdown">
<a href="#" class="list-icons-item" data-toggle="dropdown">
<i class="icon-menu9"></i>
</a>
<div class="dropdown-menu dropdown-menu-right">
<a href="#" id="edit-row" class="dropdown-item"><i class="icon-pencil"></i> Edit</a>
<a href="#" class="dropdown-item"><i class="icon-bin"></i> Delete</a>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<!-- /default ordering -->
</div>
</div>
</div>
</body>
</html>我正在尝试在点击的编辑按钮上放置一个点击监听器。
但是，我目前只收到undefined 回复。相反，我想取回第一列中的 id。
任何建议我做错了什么？
【问题讨论】：
标签： javascript jquery datatables