table是这样的 id,name,age,email,adress。id被我隐藏不显示在table,我想点击每一行后面的详情,用jquery ajax读取这一行的数据,该怎么做
<table>
<tr>
<td>name</td>
<td>age</td>
<td>emaill</td>
<td>adress</td>
<td> </td>
</tr>
<tr>
<td>张三</td>
<td>21</td>
<td></td>
<td></td>
<td><input type="button"id=""value="详情"/> </td>
</tr>
<tr>
<td>李四</td>
<td>31</td>
<td></td>
<td></td>
<td><input type="button" id="more" value="详情"/> </td>
</tr>
</table>
<tr data-id="xxx">
<td>name</td>
<td>age</td>
<td>emaill</td>
<td>adress</td>
<td><button data-id="11">Click</button></td>
</tr>
var dataId = $(this).data('id'); //点击按钮,获取id
//该干嘛干嘛...
一下子点醒了 我实际用的是DataGrid 我的按钮是超链接写的 按照这样的 该怎么定义上文的tr呢 事件又该怎么写
@伊夏丶: 就把data-id放在超链接上哇,我上面贴的代码里面tr那里的data-id是多余的。
@幻天芒: 好我试试
//只能帮你到这了 $("input[type=button]").live("click",function(){ var td=$(this).closest("tr").find("td"); $.each(td,function(index,element){ }); });
和我想要的结果好像不一样。。
@伊夏丶: 你想怎么做,根据id再向后台读取?你这table中的值是怎么获取的?
@MrNice:sql语句获取的啊,显示在table,我点击详情,是在第二个页面的另一个table显示详情的
@伊夏丶: 这个好解决
你这绑定button时给它一个data-id的属性,值就是数据id,当点击button时取出当前button的data-id
的值调用然后跳转到第二页面并加上参数id,第二个页面一加载就根据id取出对应记录显示
@MrNice: 你说的我明白了
{ field : 'more', title : '详情', width : 30, formatter : function(value, rowData,rowIndex) { return "<a href=\"javascript:void(0)\" onclick=\"More('" + rowData.More + "')\">详情</a>"; }, }
但是我的按钮是超链接这样的 不能绑定id啊 要是绑定了就都是那个id的数据了
@MrNice: 我写input type="button" 只是举个例子 因为都是要写onclick事件的
@伊夏丶:
{ field : 'more', title : '详情', width : 30, formatter : function(value, rowData,rowIndex) { return "<a href=\"javascript:void(0)\" +"data-id="+rowData.ID+"onclick=\"More('" + rowData.More "')\">详情</a>"; }, } //jquery取值就是这么取,我这么选取你根据自己实际情况 $("a").live("click",function(){ var id= $(this).data("id"); alert(id); });
@MrNice:按你直接写的报错 我改成 id=\"'"+rowData.ID+"'\" 下面的jquery又报错$(...).live is not a function 好像是我写错了
@伊夏丶: 写错那估计是我拼错了
@MrNice: 但是下面那段是我写错地方了吗 报错$(...).live is not a function
@伊夏丶: 那就把live换成on
你只获取那一行的id值 去后台读取就可以啦
我想用jquey ajax获取 然后在另一个页面显示 要是后台读取又费一步
还有 怎么用jqueryajax获取我也不是很清楚
@伊夏丶: 这跟ajax 没什么关系吧
$("table").on("click","input[type=button]",function(){
var tds=$(this).closest("tr").children("td");
var name = tds.eq(0).text();
...
})
@老沙沙沙: = =我就这样举个例子 我实际用的是easyui的DataGrid 最后的详情也不是按钮是超链接,不过写的事件都是一样的。我就想知道遇到这种问题该怎么做,学会就好了
你做的是什么页面呀? 纯HTML么。。
页面就纯htnl js单独写的
@伊夏丶: http://blog.csdn.net/caoyuan10036/article/details/7227214 ,你去看看,页面传值的
@搁忆: 我想用 xxx.jsp?id=..&name=..这样的
@伊夏丶:http://ask.csdn.net/questions/178524
首先对于这种操作表格总的一行或者一列,肯定是要使用事件捕获的。
$('#tableid').click(function(event){
if(event.target === 一行的标记){
event.target//获取一行的信息,调用ajax方法:
$.ajax({});
}
})
不会event。。
@伊夏丶: 这个是必须要会的,要不然你要给每一行加事件么?
@xingoo: 我现在是通过点击 详情 然后获取
{ field : 'more', title : '详情', width : 30, formatter : function(value, rowData,rowIndex) { return "<a href=\"javascript:void(0)\" onclick=\"More('" + rowData.More + "')\">详情</a>"; }, }我每一行都有这个超链接,不用用event吧
@伊夏丶: 你是直接设置onclick属性了,这样有点不解耦.....效果确实是一样的
来晚了,分没了。看你怎么绑定的数据,1、model直接绑定数据,只能通过Id找到那一行,然后遍历每个td,获取text();2、Ajax获取数据绑定,获取数据后,保存在一个数组变量中,通过id去这个变量中拿数据。
表格我是在js用easyui的datagrid写的
@伊夏丶: onSelect事件
当用户选择一行时触发,参数如下:
rowIndex:被选择的行索引,从0开始。
rowData:对应于被选择行的记录。
@Engineer: 我现在差不多这样写的 获取row 再传到别的页面