0

PHP 和 AJAX 代码：

<div id = "galleryContainer"></div>


var linkArray = document.getElementByTagName('a');

for (var i = 0; i > linkArray.length; i++)
{
    if (linkArray[i].getAttribute('class') == 'myLinks')
    {
        linkArray[i].onclick = function ()
        {
            var url = (this.href);

            var xmlhttp;

            if (window.XMLHttpRequest)
            {
                xmlhttp = new XMLHttpRequest ();
            }
            else
            {
                xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP");
            }

            xmlhttp.onreadystatechange = function()
            {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                {
                    document.getElementById ("galleryContainer").innerHTML = xmlhttp.responseText;
                }
            }

            xmlhttp.open ("GET", "stubs/storage.php?theurl="+url, true);
            xmlhttp.send()

            return (false);

        }
    }
}

目前我正在本地主机上对此进行测试，发生的情况是我的 HTML 中显示了链接。单击时，它们会正确打开，但是 URL 会更改为图像的实际位置

http://localhost/images/gallery/image-name.extension.

为了返回页面，您实际上必须点击返回按钮。我正在尝试使链接直接在 HTML 链接所在的下方显示图片。

我正在尝试调用另一个名为 storage.php 的文件，但它似乎不起作用。我尝试使用警报，甚至使用了另一个文件，但它就是无法打开它。到目前为止，我不认为我链接文件的错误位置有问题，而是我调用文件有问题。我正在使用 W3 示例中的一些代码。

像往常一样，我做了我的研究，并尝试遵循其他 stackoverflow 示例，其中人们想在新窗口中打开某些内容并尝试将其逆向工程到我的代码中，但是它不起作用。我对 Ajax 还很陌生，所以任何帮助都将不胜感激。

4

1 回答 1

0

如果您只需要页面上的一张图片。我建议将 galleryContainer 制作为图像：

<img src="" id="galleryContainer" />

使用它作为 JS：

for (var i = 0; i > linkArray.length; i++)
{
    if (linkArray[i].getAttribute('class') == 'myLinks')
    {
        linkArray[i].onclick = function ()
        {
            var url = (this.href);

            document.getElementById('galleryContainer').src = url;
            return false;
        }
    }
}

每次更改源时，图像都会重新加载，我认为这可以达到您想要达到的效果。

也就是说，正如人们在评论中提到的那样，fancybox可能更有可能是您想要实现的目标，因此可能值得研究。

于 2013-04-21T07:05:56.497 回答