PHP while循环中的jQuery对话框 [英] jquery dialog in PHP while loop
问题描述
以下代码仅适用于表第一行中的按钮.其他自动生成的行的按钮不会打开任何对话框.我想问题是我没有为每个按钮分配不同的id.我怎样才能做到这一点?我阅读了此页面，但没有任何效果.
The following code works fine just for the button in the very first row of the table. The buttons of the other automatically generated rows don't open any dialog. I guess the problem is that I am not assigning a different id to each button. How can I do that? I read this page but nothing worked.
<table class="table-hovered">
<tr>
<th class="text-left big">TITOLO</th>
<th class="text-centered" align="center">
<img src="img/w.png" width="35" height="35" title="wikipedia" align="middle"><br>
wikipedia
</th>
</tr>
<? while($objResult = mysql_fetch_array($objQuery))
{ ?>
<tr>
<td class="text-left"><?=$objResult["titolo"];?></td>
<td class="text-centered">
<button id="trigger" class="btn">definizione</button>
<div id="dialog" style="display: none;" title="definizione">
<iframe frameborder="0" scrolling="yes" width="480" height="380" src="def.php?titolo=<?=$objResult['titolo'];?>"></iframe>
</div>
</td>
<script>
$("#trigger").click(function() {
$("#dialog").dialog("open");
});
$("#dialog").dialog({
autoOpen: false,
position: 'center' ,
title: 'definizione',
draggable: true,
width: 500,
height: 400,
resizable: true,
modal: true,
show: 'slide',
hide: 'fade'
});
</script>
</tr>
<? } ?>
</table>
推荐答案
问题是因为您要创建具有相同id属性的多个元素，其中id在单个document中必须唯一.而是在#trigger上使用公共类，然后从那里找到要显示的相关#dialog.试试这个:
The issue is because you are creating multiple elements with the same id attribute, where the id must be unique within a single document. Instead, use common classes on the #trigger and from there find the related #dialog to be shown. Try this:
<table class="table-hovered">
<tr>
<th class="text-left big">TITOLO</th>
<th class="text-centered" align="center">
<img src="img/w.png" width="35" height="35" title="wikipedia" align="middle"><br>
wikipedia
</th>
</tr>
<? while($objResult = mysql_fetch_array($objQuery))
{ ?>
<tr>
<td class="text-left"><?=$objResult["titolo"];?></td>
<td class="text-centered">
<button class="btn trigger">definizione</button>
<div class="dialog" style="display: none;" title="definizione">
<iframe frameborder="0" scrolling="yes" width="480" height="380" src="def.php?titolo=<?=$objResult['titolo'];?>"></iframe>
</div>
</td>
</tr>
<? } ?>
</table>
然后可以将单个事件处理程序分配给<head>中或</body>之前的.trigger元素，如下所示:
You can then assign a single event handler to the .trigger elements in either the <head> or just before </body>, like this:
<script type="text/javascript">
$(function() {
$(".trigger").click(function() {
$(this).next('.dialog').dialog("open");
});
$(".dialog").dialog({
autoOpen: false,
position: 'center' ,
title: 'definizione',
draggable: true,
width: 500,
height: 400,
resizable: true,
modal: true,
show: 'slide',
hide: 'fade'
});
});
</script>
这篇关于PHP while循环中的jQuery对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
