php - JQueryUI 模态对话框；与动态图像一起使用

Question

我正在使用这样的 jQueryUI 对话框模式：

<div id="dialog-modal" title="Basic modal dialog">
    <img src="#" alt="Pictures" />
</div>

我有一个 PHP foreach循环，可以在任何给定时刻显示三个图像图标。图像 url 在 MySQL 数据库中。图像本身包含在锚标记内，并显示为缩略图。<a>包含一个名为“theLink”的类。当您单击“theLink”（实质上是单击图片）时，jQuery 知道会打开对话框。

我希望通过单击图像可以显示比缩略图大得多的图像。然后它将图像链接动态传输到将显示它的模式对话框。<body>同样，标签下方有一个模态对话框 div（如上所示）。这就是我要找的：

当您单击“theLink”时，它将从 img 中获取 PHP 生成的图像链接，并使用它来替换模态 div 中的“#”。

<a> <img src="PHP GENERATED" /> </a>

score 1 · Accepted Answer

我通过了解 jQuery 基础知识找到了答案。

我必须在 php 生成的图像中创建一个名为 ImageLink 的类。我必须使用一个类，而不是一个 ID，因为这个类会重复三次，因为我一次显示三个缩略图。

关键字“this”很重要，因此我可以指向特定的 imageLink 类。

  <a><img src="PHP GENERATED" class="imageLink" /></a>

然后，在 jQuery 中：

    var realImage = $(this).find('.imageLink').attr("src");
    $('#popUpImage').attr('src', realImage);
    $('#dialog-modal').dialog('open');

1 回答 1