0

我正在尝试通过使用 smarty 模板和 foreach 循环来显示表中的数据列表..但我想让一个 id 能够在每个..下面显示新数据..但它只适用于第一个

问题在于带有 id(主题)的 img 我想在每次单击 img 时显示 id(结果).. 但它只适用于第一行.. 我怎样才能使它适用于所有行?

<script type="text/javascript">
$(document).ready(function(){    
$('#subjects').click(function(){  
$('#result').fadeIn(2000);
});
});
</script>

<br /><br /><table width="100%">
<tr class="tbl">
<td colspan="6">{$ci->lang->line('modules_list')}</td>
</tr><tr>
<td class="tbl1" style="width: 8%;">{$ci->lang->line('number')}</td>
<td class="tbl2" style="width: 28%;">{$ci->lang->line('title')}</td>
<td class="tbl1" style="width: 10%;">{$ci->lang->line('add_subject')}</td>
<td class="tbl2" style="width: 10%;">{$ci->lang->line('subjects_list')}</td>
<td class="tbl1" style="width: 8%;">{$ci->lang->line('edit')}</td>
<td class="tbl2" style="width: 8%;">{$ci->lang->line('delete')}</td>
</tr>
{foreach $modules_list as $module}
<tr>
<td class="tbl1" style="width: 8%;">{$module.number}</td>
<td class="tbl2" style="width: 28%;">{$module.title}</td>
<td class="tbl1" style="width: 10%;"><a href="{base_url('admincp/subjects/add')} /{$module.id}"><img src="{base_url('images/icons/add.png')}" /></a></td>
<td class="tbl2" style="width: 10%;"><img id="subjects" src="{base_url('images/icons/list.png')}" /></td>
<td class="tbl1" style="width: 8%;"><a href="{base_url('admincp/modules/edit')}/{$module.number}"><img src="{base_url('images/icons/edit.png')}" /></a></td>
<td class="tbl2" style="width: 8%;"><a onclick="return confirm('{$ci->lang->line('delete_confirm_msg')}')" href="{base_url('admincp/modules/delete')}/{$module.number}"><img src="{base_url('images/icons/delete.gif')}" /></a></td>
</tr>
<tr id="result" style="display:none">
<td>RESULT</td>
</tr>
{/foreach}
</table>
</div>
</body>
</html>

==

我已经解决了这个问题,它现在可以工作了,但是我还有另一个小问题,当我显示隐藏的 tr 时,我想使用 aJax 从另一个页面获取有关每个 moduke 的一些信息 .. 我希望它从页面获取一些数据( modules/$module_id) .. 我知道如何使用 ajax .. 但是我如何在 javascript 代码中使用变量 {$module_id} ?

4

3 回答 3

1

这是每个 jQuery 的工作原理:

$(".elements").each( function() {
  $(this);
})

http://api.jquery.com/jQuery.each/

于 2013-09-17T08:56:30.147 回答
1

您应该使用classfor resultsand subjects,否则您将获得重复id的属性,这将使您的页面无效。此外,为每个模块添加一个类,tr以便轻松识别它。尝试这个:

{foreach $modules_list as $module}
    <tr class="module-row">
        <td class="tbl1" style="width: 8%;">{$module.number}</td>
        <td class="tbl2" style="width: 28%;">{$module.title}</td>
        <td class="tbl1" style="width: 10%;"><a href="{base_url('admincp/subjects/add')} /{$module.id}"><img src="{base_url('images/icons/add.png')}" /></a></td>
        <td class="tbl2" style="width: 10%;"><img class="subjects" src="{base_url('images/icons/list.png')}" /></td>
        <td class="tbl1" style="width: 8%;"><a href="{base_url('admincp/modules/edit')}/{$module.number}"><img src="{base_url('images/icons/edit.png')}" /></a></td>
        <td class="tbl2" style="width: 8%;"><a onclick="return confirm('{$ci->lang->line('delete_confirm_msg')}')" href="{base_url('admincp/modules/delete')}/{$module.number}"><img src="{base_url('images/icons/delete.gif')}" /></a></td>
    </tr>
    <tr class="result" style="display:none">
        <td>RESULT</td>
    </tr>
{/foreach}
$('.subjects').click(function() {  
    var $tr = $(this).closest('tr');
    $tr.nextUntil('.module-row').fadeIn(2000);
});
于 2013-09-17T08:58:22.160 回答
0

id 在文档中必须是唯一的。只能有一个具有给定 id 的对象。所以,试图参考这个的后续版本

<tr id="result" style="display:none">

超出第一个将无法正常工作。 $('#result')只会找到第一个。

相反,将其更改为一个类并执行以下操作:

<tr class="result" style="display:none">

$('.result:hidden').first().fadeIn(2000);

该类允许您附加具有相同类的许多对象。然后,jQuery 会找到具有该类的那些也被隐藏的类,然后只淡入第一个类。

于 2013-09-17T08:55:06.507 回答