[英]Jquery : how to know which row is selected?
我有一个表,其中包含动态更改的行项目。
在各行中,每个单元都有一个小按钮/链接。
例如
Data1 | LinkButton
Data2 | LinkButton
Data3 | LinkButton
Data4 | LinkButton
Data5 | LinkButton
Data6 | LinkButton
我想要的是,当我单击链接按钮时,我需要知道选择了哪一行?任何人都可以向我指出如何做到这一点吗?
您的帮助将不胜感激。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link href="css/main.css" type="text/css" media="screen, projection" rel="stylesheet" />
</head>
<body><center>
<div id="message" style="display: none;">
</div>
<div id="waiting" style="display: none;">
Please wait<br />
<img src="images/ajax-loader.gif" title="Loader" alt="Loader" />
</div>
<form action="" id="searchForm">
<label for="search">Matter Search:</label> <input type="text" name="search" id="search" />
<input type="submit" id="submit" value="Submit" />
<a href="#">Link</a>
</form>
<div id="matterTableDiv" style="display: none;">
List of Matters
<table id="matterTable" border="1">
<thead>
<th>Matter Names</th>
<th>Matter Number</th>
<th>Description</th>
<th></th>
</thead>
<tbody>
</tbody>
</table>
</div>
<div id="matterDetailTableDiv" style="display: none;">
Matter Detail Table
</div>
<script type="text/javascript" src="js/json2.js"></script>
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#search').focus();
$('#submit').click(function(){
$('#message').hide(200);
$("#matterTableDiv").hide(200);
$("#matterTable tbody").text("");
$('#waiting').show(200);
$('#searchForm').hide(200);
$.ajax({
type : 'POST',
url : 'post.php',
dataType : 'json',
data: {
search : $('#search').val()
},
success : function(data){
if(data.msg == "[]" ){
$('#waiting').hide(200);
$('#message').removeClass().addClass('error')
.text('There was an error.').show(200);
$('#searchForm').show(200);
}
$('#waiting').hide(200);
$('#matterTableDiv').removeClass().addClass((data.error === true) ? 'error' : 'success')
if(data.error == false){
var str = JSON.parse(data.msg);
$("#matterTableDiv").show(200);
//alert("List :" + str.length);
//alert("List :" + str.toString());
$("#matterTable").html();
$.each(str, function(key, value) {
var tblRow =
"<tr>"
//+"<td><a id="+key+" href='#dbID="+value.dbID+"&matID="+value.matterID+">"+value.matterInfoSortName+"</a></td>"
+"<td>"+value.matterInfoSortName+"</td>"
+"<td>"+value.matterInfoMatterNum+"</td>"
+"<td>"+value.matterInfoFileDesc+"</td>"
+"<td><input type='button' value="+value.matterInfoFileDesc+"></td>"
+"</tr>";
$(tblRow).appendTo("#matterTable tbody");
//alert(key + ': ' + value.matterInfoSortName);
});
$("button").live("click",function(){
var row = $(this).closest("tr");
var rowIndex = row.index();
alert(rowIndex);
});
}else{
$('#message').removeClass().addClass('error')
.text('There was an error.').show(200);
}
$('#searchForm').show(200);
if (data.error === true)
$('#searchForm').hide(200);
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
$('#waiting').hide(200);
$('#message').removeClass().addClass('error')
.text('There was an error.').show(200);
$('#searchForm').show(200);
}
});
return false;
});
});
</script>
</center>
</body>
我知道您需要行索引,有些用户为您提供了答案。 但是,通常我们需要该行的ID,因为该ID属于数据库中的ID。 在这种情况下,您可以使用单元格的ID或按钮本身。 例:
<table>
<tr id="Data1"><td>a</td><td>b</td><td>c</td><td><input type="button" value="Data"/></td></tr>
<tr id="Data2"><td>a</td><td>b</td><td>c</td><td><input type="button" value="Data"/></td></tr>
<tr id="Data3"><td>a</td><td>b</td><td>c</td><td><input type="button" value="Data"/></td></tr>
<tr id="Data4"><td>a</td><td>b</td><td>c</td><td><input type="button" value="Data"/></td></tr>
</table>
$("input[type=button]").live("click", function() {
var row = $(this).closest("tr");
var rowId = row.attr("id");
alert(rowId);
});
你在这里:
您可以从处理程序中的this
按钮(单击的按钮)开始,然后使用.closest()
获取按钮的<tr>
,然后从那里获取想要的任何内容,例如:
$(".someButton").live("click", function() {
var row = $(this).closest("tr");
var rowIndex = row.index();
});
我猜你在用...
$('.all_links').click(some_function)
因此,在这种情况下,您可以像这样在some_function
内部简单地找到它:
function some_function() {
$(this).parents('tr'); // this will give you the link's row.
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.