我找到了很多关于我的问题的答案,但问题没有解决
我有数据表,例如:
<table>
<tr>
<td class="editable"> <a id="query" href="#"> Data 1 </a> </td>
<td class="editable"> <a id="text" href="#"> Data 2 </a> </td>
<td class="editable"> <a id="foo" href="#"> Data 3 </a> </td>
<td class="editable"> <a id="bar" href="#"> Data 4 </a> </td>
</tr>
<tr>
<td class="editable"> <a id="query" href="#"> Data 1 </a> </td>
<td class="editable"> <a id="text" href="#"> Data 2 </a> </td>
<td class="editable"> <a id="foo" href="#"> Data 3 </a> </td>
<td class="editable"> <a id="bar" href="#"> Data 4 </a> </td>
</tr>
</table>
我需要:
对于此表中的每一行,获取当前行中id =“query”和id =“foo”的链接值并发送ajax查询
我尝试这样做:
$("#detect_rel").click(function(){
$('tr').each(function() {
// ajax to: ajax.php?query=xxxx&data=&xxxxx
});
});
但我无法获得<a id="query"...
和<a id="foo"...
的内部文字,对于当前行
我试过这样的事情:
$('tr').each(function() {
var cols = $('.1, .2', this);
// do something with cols
});
但它没有帮助,因为我无法获得({1}}和<a id="query"...
两者的内部文本,因为当前行
伪代码:
获取行
<a id="foo"...
获取下一行
等
注意:每个单元格get value of link in column_one and column_two
send ajax query
,'bootstrap x editable'需要,并且因为它,我需要在每个链接使用id
问题已解决,谢谢你们
答案 0 :(得分:4)
在HTML ID中,必须是唯一的,而类可以在页面中多次出现。要做你要求的,你的HTML应该是这样的:
<table>
<tr>
<td class="editable"> <a class="query" href="#"> Data 1 </a> </td>
<td class="editable"> <a class="text" href="#"> Data 2 </a> </td>
<td class="editable"> <a class="foo" href="#"> Data 3 </a> </td>
<td class="editable"> <a class="bar" href="#"> Data 4 </a> </td>
</tr>
<tr>
<td class="editable"> <a class="query" href="#"> Data 1 </a> </td>
<td class="editable"> <a class="text" href="#"> Data 2 </a> </td>
<td class="editable"> <a class="foo" href="#"> Data 3 </a> </td>
<td class="editable"> <a class="bar" href="#"> Data 4 </a> </td>
</tr>
</table>
你的jQuery代码应该是这样的:
$('#detect_rel').click(function() {
$('tr').each(function(i, el) {
var query = $(el).children('td').children('.query').text();
var text = $(el).children('td').children('.text').text();
//$.ajax (do your AJAX call here using values of query and text
});
});
我刚刚在JSFiddle上测试了这段代码并且它可以工作。