前台绑定数据:
<div class="mailbox-content">
<table class="table">
<tbody>
@using (Html.BeginForm())
{
int i = 1;
foreach (var item in Model)
{
<tr class="table-row" onclick="showID()">
<td class="table-img">
<img src="~/images/in11.jpg" alt="1">
</td>
<td class="table-text" id="dev@{@i.ToString()}">
<h6>@item.gname</h6>
<p>@item.price</p>
</td>
</tr>
i++;
}
}
</tbody>
</table>
</div>
其中 dev@{@i.ToString()}是为td绑定ID值
ShowID()为javascript中的一个方法
<script></script>源码:
<script type="text/javascript">
function showID() {
$("tr").click(function () {
var ids = $(this).children("td").eq(1).attr("id");
var pt = $("#" + ids).children("p").text();
}
</script>
ids: 点击的tr中的第二个td的值,如果想获取第一个改变eq(1)为eq(0);
pt: 为获取第二个td标签下的p标签中的内容;
福利
不会ajax的看下面 !!!!!
<script type="text/javascript">
function showID() {
$("tr").click(function () {
var ids = $(this).children("td").eq(1).attr("id");
var pt = $("#" + ids).children("p").text();
$.ajax({
type: 'post',//提交类型
url: "/Home/GetJson",//控制台中的方法
data: {
'pts':pt
},//数据
dataType:"Json"//数据类型
})
});
}
</script>
当然后台接收时方法中的参数名字须于前台data中的名字一致,否则接收不到数据
如: