javascript - html/javascript : using a variable as url for <a href>

Question

我用一些 JavaScript 开发了一个 html 页面。 我有几个标签，单击链接后，其中一个标签会动态分配背景图像。该 url 存储在全局变量中。到目前为止一切顺利。

var picture,thumb

function changeDivs(p)
{
     if (p!='') {
        picture = './images/p'+p+'.jpg'; // global url variable
        thumb = './thumbs/p'+p+'.jpg'; // global url variable
        var pic = "url("+thumb+")";
        document.getElementById("poster").style.backgroundImage = pic;
        }
}

我这样调用该函数:

<a href="javascript:changeDivs('2')">Link</a>

现在我想使用缩略图查看器脚本，需要像这样访问:

<a href="javascript: global variable" rel="thumbnail"> <!-- Of course this "javascript: global variable" should be a valid url: the stored 'picture' variable -->
        <div id="poster"> 
        </div>
    </a>

所以我将网址存储在变量:图片中

如何通过 <a href> 访问缩略图查看器脚本并使用该变量。我不知道缩略图脚本是否可以通过函数或如何调用。

非常感谢!

Answer 1

我认为这就是您想要实现的目标。这是jsfiddle .
当 '<a href>'单击图像将成为 "<div id='poster'>" 的背景

我用您现有的缩略图网址替换了您图片的网址。请确保您的图片和拇指变量的 URL 存在。另外，我设置了海报 div 的宽度和高度。

要使用缩略图查看器，请尝试新的 jsfiddle 链接。仅供引用，dynamicdrive 阻止了 jsfiddle 访问 js 文件。请在您自己的项目中尝试该代码。