如何在单独的窗口中打开图像


How to open images in a separate window?

我在下面有一个表格,其中列出了每个问题的每张图片。

    <table id="tableqanda" cellpadding="0" cellspacing="0">
        <thead>
        <tr>
            <th width="5%" class="questionno">Question No.</th>
            <th width="11%" class="image">Image</th>
        </tr>
        </thead>
        </table>
        <div id="tableqanda_onthefly_container">
        <table id="tableqanda_onthefly" cellpadding="0" cellspacing="0">
        <tbody>
            <?php
              foreach ($arrQuestionId as $key=>$question) {
            echo '<tr class="tableqandarow">'.PHP_EOL
echo '<td width="5%" class="questionno">'.htmlspecialchars($arrQuestionNo[$key]).'</td>' . PHP_EOL;
            echo '<td width="11%" class="imagetd">';
            if (empty($arrImageFile[$key])) {
                echo '&nbsp;';
            } else {
                echo '<ul class="qandaul"><li>';
                echo implode("</li>'n<li>", array_map(function($imgitem){
                return htmlspecialchars($imgitem);
            },  $arrImageFile[$key]));
                echo '</li></ul>';
            }
            echo '</td>';
            echo '</tr>'.PHP_EOL;
            }
    ?>
        </tbody>
        </table>
        </div>

现在它只是在项目符号列表中列出图像文件名。但是我想做的是,我想将每个文件设置为超链接,以便如果用户单击图像链接,它将在单独的页面中显示该图像(将打开一个单独的窗口),显示图像本身

我的问题是如何做到这一点,我需要执行以下步骤?如果有人可以逐步向我展示如何编码,那么我也可以将其用于音频和视频。

谢谢

好的,我一直在考虑你想做什么,我想你想将图像列表显示为缩略图或其他东西,然后单击一个图像并在新页面上显示它(在你的布局内)(预览图像.php)。

你有很多选择...但它们都归结为通过 URL 传递一些信息(example.com/previewimage.php)。

首先,让我们研究一下通过 URL 传递信息的 2 种典型方法

$_GET 请求

有时您会看到网站传递将信息添加到 URL,例如

example.com/previewimage.php?var=xxx

这允许您通过 $_GET 超全局将一些信息传递给 PHP 脚本。

赫特通

如果你想变得有点花哨,你可以使用htaccess来制作一个干净的URL

RewriteRule ^([a-zA-Z0-9]+)/$ previewimage.php?var=$1

这将让您拥有一个像 example.com/xxx 这样的 URL,服务器的行为就像您去 example.com/previewimage.php?var=xxx 一样。

现在您知道如何将信息传递给 url,我们可以研究一些使用 $_GET['var'] 显示图像的方法。

最简单的方法是简单地传递文件名...对于此示例,我们将其称为 example.png。

如果您使用的是上述基本的 $_GET 请求方法,则您的网址将类似于 example.com/previewimage.php?var=example.png。

然后,在预览图像.php中,您只需执行以下操作

<img src="<?php echo $_GET['var'] ?>"/>

这将输出

<img src="example.png"/>

但是,这不是一种非常安全的方法,因为任何人都可以加载他们想要的任何东西。 更好的选择可能是使用数组或数据库,然后传递某种键并检索文件名。

我认为这会让你走上正确的道路(我希望它能回答你的问题)。

假设这个问题是如何在新选项卡中打开链接。用这个包围任何你喜欢的东西,在这种情况下是图像。

<a href="/linktoimage.png" target="_blank"><img src="/linktoimage.png" alt="my image"></a>

下面是如何做到这一点的示例。刚刚对内部"如果否则"循环进行了编辑

将YOUR_BASE_URL_FOR_IMAGES_HERE_ENDING_WITH_A_DASH替换为服务器上映像的目录路径。

if (empty($arrImageFile[$key])) {
    echo '&nbsp;';
} else {
    echo '<ul class="qandaul"><li>';
    echo implode("</li>'n<li>", array_map(function($imgitem) {
                        return '<a href="YOUR_BASE_URL_FOR_IMAGES_HERE_ENDING_WITH_A_DASH' . htmlspecialchars($imgitem) . '" target="_blank">' . htmlspecialchars($imgitem) . '</a>';
                    }, $arrImageFile[$key]));
    echo '</li></ul>';
}