cakephp中的多个jquery弹出窗口答案

【问题标题】：multiple jquery popups in cakephpcakephp中的多个jquery弹出窗口
【发布时间】：2010-07-07 18:48:02
【问题描述】：

我正在显示电子邮件列表，对于每封点击的电子邮件，我正在尝试创建一个弹出窗口以显示完整的电子邮件内容....

问题在于，弹出窗口仅适用于第一封电子邮件，其余的则不显示任何内容，

这是我的代码，

foreach ($email as $x){

            echo "<div id='popuup_div' class='popup_msg'>";
            echo "<div id='image'>";
            echo $html->image('mail.png');
            echo "</div>";
            echo "<br>";
            echo $client['Email']['body'];
            echo "</div>";

            $show = substr($client['Email']['body'], 0, 65);


            echo $html->tableCells(array(array($client['Email']['date'], $client['Email']['time'],
                            $client['Email']['from'], $show . "......" .
                            "<div id='popupShow'> Show more....... </div>")));}

jquery 代码

jQuery.noConflict();
 `jQuery(document).ready(function(){

jQuery('#popupShow').click(function(e){ //获取消息框的高度和宽度 var height = jQuery('#popuup_div').height(); var 宽度 = jQuery('#popuup_div').width(); //计算显示弹出消息的偏移量 leftVal=e.pageX-(width/1.5)+"px"; topVal=e.pageY-(高度/13)+"px"; //显示弹出消息并以淡入淡出效果隐藏 jQuery('#popuup_div').css({left:leftVal,top:topVal}).show(); });

jQuery('#image').click(function(e) { jQuery('#popuup_div').fadeOut('fast'); }); });`

我怎样才能使它适用于所有电子邮件？

【问题讨论】：

标签： jquery cakephp

【解决方案1】：

HTML id 必须是唯一的。尝试用类替换你的 id。

【讨论】：

我同意。除此之外，您可以将所有对话框放入容器 div 中，其 id 为“my-dialogs”。当您需要创建对话框时，请执行：jQuery('.some-dialog-class', '#my-dialogs').dialog(); 此优化将更快地定位对话框 HTML。还使 HTML 更整洁 :)
我尝试用类替换，现在弹出窗口适用于所有电子邮件。但是弹出的内容都是一样的，都是最后一个邮件内容......

【解决方案2】：

在这个问题中我没有看到很多 CakePHP。我也没有看到会遍历电子邮件的循环。

【讨论】：