2

私はこのjqueryを持っています:

$('#team-members .team-thumb').on('click', function(e){
        e.preventDefault();
        var member = $(this).data('member');
        $('#team-members .team-profiles').slideToggle();
        teamSlider.reloadSlider({
            startSlide: member,
            pager: false,
            adaptiveHeight: true
        });
        $('html,body').animate({
            scrollTop: $("#team-profiles").offset().top},
        'fast');
        $('.bx-viewport').prepend('<div id="slide-me"></div>');
    });

このイベントを 1 回だけ先頭に追加して、2 回目のクリックで DOM に追加しないようにするにはどうすればよいですか。

$('.bx-viewport').prepend('<div id="slide-me"></div>');
4

2 に答える 2

4

jQuery のone()コマンドを使用します。

$('#team-members .team-thumb').one('click', function(e){ ... }

説明: 要素のイベントにハンドラーをアタッチします。ハンドラーは、イベント タイプごとに要素ごとに最大 1 回実行されます。

この組み込みコマンド以外に、ブール値フラグをいつでも使用できます。

var event_handler_enabled = true;
$('#team-members .team-thumb').one('click', function(e){
  if ( event_handler_enabled ){
    // code for handling click goes here
    event_handler_enabled = false; // ensure this code will not be executed again
  }   
}

最初のオプションをお勧めします。車輪を再発明する理由はありません。jQuery にハンドラーを 1 回だけ実行するためのメソッドが組み込まれている場合は、それを使用してください。:)

于 2013-10-31T11:29:22.100 に答える
2

クリックイベント内でこれを行うことができます：

var $viewport = $('.bx-viewport');
if($viewport.find('#slide-me').length === 0)
     $viewport.prepend('<div id="slide-me"></div>');
  • bx-viewport最初に要素をキャッシュします。
  • が要素の先頭にまだ挿入されていない場合は、要素を先頭に追加します。それ以外の場合は何もしませんslide-me。bx-viewport
于 2013-10-31T11:32:32.020 に答える