سلام
کد زیر را نوشته ام
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="bootstrap.min.css">
</head>
<body>
</body>
<table class="table text-center ">
<tr data-id="t0">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td>Row3</td>
</tr>
<tr data-id="t1">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td><a onclick="EditStatus();">clickb1</a></td>
</tr>
<tr data-id="t2">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td> <a onclick="EditStatus();">clickb2</a></td>
</tr>
<tr data-id="t3">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td><a onclick="EditStatus();">clickb3</a></td>
</tr>
</table>
<script src="jquery-3.1.1.min.js"></script>
<script src="bootstrap.min.js"></script>
<script>
function EditStatus() {
alert($(this).parents('tr').data('id'));
}
</script>
</html>
می خواهم وقتی تابع مورد نظر کلیک شد مقدارdata-id tr را برگرداند
اما نمی دانم چرا مقداری برنمیگرداند
کد صحیح چه می باشد
به شکل زیر عمل کنید:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<table class="table text-center ">
<tr data-id="t0">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td>Row3</td>
</tr>
<tr data-id="t1">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td><a>clickb1</a></td>
</tr>
<tr data-id="t2">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td> <a>clickb2</a></td>
</tr>
<tr data-id="t3">
<td>Check</td>
<td>Row1</td>
<td>Row2</td>
<td><a>clickb3</a></td>
</tr>
</table>
<script>
$(document).on('click', 'td a', function () {
var element = $(this);
var id = element.parents('tr').data('id')
alert(id);
});
</script>
</body>
</html>
هیچ کاربری تا کنون از این پست تشکر نکرده است
با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)