Question

我正在尝试使用javascript在新窗口中打开当前可见照片，但它也必须在iPad上运行。我尝试的是在工具栏中添加一个按钮（如示例中所示）。我还在photoswipe.css中添加了该按钮的CSS。我添加了一个javascript函数：

function getImgUrl()
{
    var divHead = getElementsByClassName(document, 'ps-carousel-content');
    var imgElement = divHead[0].getElementsByTagName("img");
    var imgUrl = imgElement[1].getAttribute('src');
    window.open(imgUrl.toString())
}

我确实使用了示例中的代码来获取自定义工具栏，但添加了创建按钮的部分：

getToolbar: function(){
    return '<div class="ps-toolbar-close"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-play"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-previous" style="padding-top: 12px;"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-next"><div class="ps-toolbar-content"></div></div><div onclick="javascript: getImgUrl();" class="ps-toolbar-download"><div class="ps-toolbar-content"></div></div>';
}

这在Chromekit和safari等webkit浏览器中完美运行（照片在新窗口/标签中打开）。但是当我在iPad上试用它时，它不起作用。按下按钮时没有任何反应。

有人可以帮我解决这个问题吗？也许我做错了，所以告诉我一个不同的方法是否会更好。

谢谢！

Answer 1

iPad很可能会阻止这个脚本作为弹出式播放器＆＃39;。见this SO问题。要确保问题是弹出窗口拦截器，请转到设置＆gt; Safari＆gt; ＆＃34;阻止弹出窗口＆＃34;把它关掉，看它现在是否有效。

如果您确定它是弹出窗口阻止程序而不是其他问题，请尝试将打开图像的方式更改为以下内容：

function getImgUrl()
{
    var divHead = getElementsByClassName(document, 'ps-carousel-content');
    var imgElement = divHead[0].getElementsByTagName("img");
    var imgUrl = imgElement[1].getAttribute('src');
    return imgUrl.toString();
}

getToolbar: function(){
    return '<div class="ps-toolbar-close"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-play"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-previous" style="padding-top: 12px;"><div class="ps-toolbar-content"></div></div><div class="ps-toolbar-next"><div class="ps-toolbar-content"></div></div><a href="' + getImgUrl() + '" target="_blank" class="ps-toolbar-download"><div class="ps-toolbar-content"></div></a>';
}

我更改了您的函数，将图片网址作为字符串返回，然后将其插入您的getToolbar返回字符串中。

PhotoSwipe在新窗口中打开照片

1 个答案: