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にハッシュタグがある場合にのみギャラリーが表示されます。しかし、リンクをクリックしても何も起こりません。2回クリックすると、ギャラリーがフェードインします。

したがって、リンクは最初にjavascriptを作成しますが、URLにハッシュタグがないため、機能しません。その後、hrefを実行し、URLにハッシュタグを挿入します。どうやってやるの？

私の目標：

リンクをクリックするとギャラリーが開きます。どのギャラリーを開く必要があるかを知るために、URLにハッシュタグを挿入します。ここでは、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

onclickイベントを遅らせるためにsetTimeout呼び出しを試しましたか？

このような：

<a href="#HDR" onClick="setTimeout(function(){showGallery.call(this)},20)">I</a>
于 2012-12-06T12:48:00.627 に答える
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 に答える
0

リンクをたどらずにshowGallery（）を実行する場合、正しいコードは次のとおりです。

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

hrefユーザーがステータスバーに目的地を表示し続けることで、ナビゲーションはJavascriptを使用しないクライアント（つまりGoogle）でも機能します。イベントハンドラーでfalseを返すことにより、ブラウザーがリンクをたどることを防ぎます。

次に、showGallery（）でギャラリーを表示し、location.hashに「#HDR」を追加できます。

于 2012-12-06T12:52:33.127 に答える
0

最初のクリックではアドレスバーにハッシュがないため、ウィンドウのハッシュを確認する必要はありません。この機能は、2回目のクリックでのみ適用されます。

あなたができることはこれです：

<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 に答える