5

我有以下链接：

<a href="#HDR" onClick="showGallery()">I</a>

这使用以下javascript：

function showGallery(){
    if(window.location.hash) {
      $('#gallery').fadeIn('fast');
      var hash = window.location.hash.substring(1);
      alert(hash);
    } else {

    }

}

因此，它仅在 URL 中是主题标签时才显示图库。但是当我点击链接时，什么也没有发生。当我单击它两次时，画廊淡入。

所以链接首先制作了 javascript，我不工作，因为 URL 中没有标签，然后，它执行 href 并在 URL 中插入标签。我怎样才能做到这一点？

我的目标：

当我点击一个链接时，它会打开一个画廊。要知道我必须打开哪个画廊，我在 URL 中插入一个 Hashtag。在这里，我想显示 HDR 专辑。而且我还想，如果我的网站使用标签打开，它应该显示画廊。！

还有另一种更简单或更清洁的方法吗？希望你明白我想要什么。

4

5 回答 5

4

对于现代浏览器，您可以将 Javascript 代码绑定到onhashchange事件。链接将没有 Javascript：

<a href="#HDR">I</a>

每当哈希值发生变化时，Javascript 就会运行：

function locationHashChanged() {
    if (location.hash === "#HDR") {
        $('#gallery').fadeIn('fast');
    }
}

window.onhashchange = locationHashChanged;
于 2012-12-06T12:48:38.313 回答
2

您可以大大简化这一点，将 href 用于纯导航以外的其他事情并不是一个好习惯。

<a onClick="showGallery('HDR')">I</a>

接着：

function showGallery(name){
    if(name) {
        $('#gallery').fadeIn('fast');
        alert(name);
    } else {

    }
}
于 2012-12-06T12:49:20.543 回答
2

您是否尝试过调用 setTimeout 来延迟 onclick 事件？

像这样：

<a href="#HDR" onClick="setTimeout(function(){showGallery.call(this)},20)">I</a>
于 2012-12-06T12:48:00.627 回答
0

如果你想在不点击链接的情况下运行 showGallery()，正确的代码是这样的：

<a href="#HDR" onClick="showGallery(); return false;">I</a>

通过让href用户仍然可以在状态栏中看到目的地，并且导航仍然适用于没有 Javascript 的客户端（即 Google）。通过在事件处理程序中返回 false，您可以阻止浏览器跟踪该链接。

在 showGallery() 中，您可以显示图库并将“#HDR”添加到 location.hash。

于 2012-12-06T12:52:33.127 回答
0

您不需要验证窗口的哈希值，因为在第一次单击时，地址栏中没有任何哈希值。该功能仅适用于第二次点击。

你可以做的是：

<a href="#HDR" id="g1" onClick="showGallery('g1')">gallery 1</a>

function showGallery(galid){
    var linkhash = $('#' + galid).attr('href').substring(1);

    alert(linkhash);

    $('#gallery' + linkhash).fadeIn('fast');
}
于 2012-12-06T13:04:00.107 回答