0

それで、私は以下の URL (761 より前の部分) のルート JS Fiddle を使用していました。リンクは次のとおりです。

JSFiddle 全体を表示するには、ここをクリックしてください。Javascript コードは次のとおりです。

$('#trigger').click( function() {
    if ($('#popout').hasClass('hidden')) {
        $('#popout').removeClass('hidden');
        showPopout();
    }
    else {
        $('#popout').addClass('hidden');
        hidePopout();
    }
});

function showPopout() {
    $('#popout').animate({
        top: 49
    }, 'slow', function () {
        $('#trigger span').html('|||');  //change the trigger text at end of animation
    });
}

function hidePopout() {
    $('#popout').animate({
        top: -150
    }, 'slow', function () {
        $('#trigger span').html('|||');  //change the trigger text at end of animation
    });
}

しかし、ここで実装すると: http://m.bwpcommunications.com/agency.phpは機能しません。

その理由を知っている人はいますか?

4

2 に答える 2

2

DOM が読み込まれる前にクリック ハンドラを設定しているようです。

フィドルを変更してjQueryを「頭に」(ライブサイトのように)ロードすると、コードが機能しなくなることがわかります。 http://jsfiddle.net/tzDjA/764/

クリック ハンドラーの周りに次を追加する必要がある場合があります。
これにより、DOM がロードされた後にハンドラーが構成されます。

$(function() {

  $('#trigger').click( function() {
    [...]
  }  

});

http://jsfiddle.net/tzDjA/762/

または、ハンドラーを委譲して、後で DOM に追加される要素に適用されるようにしてください。

$(document).on('click','#trigger',function() {
  [...]
});

http://jsfiddle.net/tzDjA/763/

于 2013-10-31T23:01:02.667 に答える