イベント後にjQuery関数をやや上書きする方法はありますか？

Question

私は検索ボックス、チェックマーク、読み込みスピナーを持つページを持っています。ユーザーが検索ボックスにフォーカスすると、スピナーがフェードインします。ユーザーは検索ボックスにフォーカスを合わせず、スピナーはフェードアウトします。ユーザーが検索ボックスにenterキーを押した後、チェックマークを切り替える機能がありますが、チェックマークを永遠に表示したいと思います。現在のところ、ユーザがenterを押すと、チェックマークがトグルされ、自動的に非フォーカス機能が呼び出されるため、フェードアウトします。

トグルチェックマーク機能：機能とアウト

$('#searchText').on('keypress', function (e) { 
    if (e.which === 13) { 
     var val = $('#searchText').val(); 
     $('.circle-loader').toggleClass('load-complete'); 
     $('.checkmark').toggle(); 

     alert(val); 
     return false; 
    } 
}); 

フェード：

$(function() { 
    $('#searchText').focusin(function() { 
     $('#check').fadeIn(); 

    }).focusout(function() { 
     $('#check').fadeOut(); 
    }); 
}); 

ときに、ユーザーを押す停止するようにどのように私は機能フェードインとフェードアウトを上書きすることができます（または、おそらくこれを書き換えます）検索ボックスに入力しますか？

ありがとうございます。

Answer 1

jQuery .stopメソッドを使用します。要素上で.stop()が呼び出されると、現在実行中のアニメーション（存在する場合）が直ちに停止します。たとえば、.stop()が呼び出されたときに要素が.slideUp()で非表示になっている場合、要素は表示されますが、以前の高さの一部になります。コールバック関数は呼び出されません。

https://api.jquery.com/stop/

Answer 2

私は、検索が実行されたかどうかを示すためにブールでこれに近づくでしょう。下記の例を参照してください。あなたのコードの構造を知らなければ、私はそれをグローバルにしましたが、その代わりに特定のオブジェクトをチェックするように変更することができました。

トグルチェックマーク機能：

var searchPerformed = false; 
$('#searchText').on('keypress', function (e) { 
    if (e.which === 13) { 
     searchPerformed = true; 
     var val = $('#searchText').val(); 
     $('.circle-loader').toggleClass('load-complete'); 
     $('.checkmark').toggle(); 

     alert(val); 
     return false; 
    } 
}); 

フェード機能とアウト：

トグルチェックマーク機能で

$('#searchText').unbind("focusin"); 
    $('#searchText').unbind("focusout"); 

で固定

$(function() { 
    $('#searchText').focusin(function() { 
     $('#check').fadeIn(); 

    }).focusout(function() { 
     if (!searchPerformed) 
      $('#check').fadeOut(); 
    }); 
}); 

Answer 3

。 誰もが代わりの方法をお寄せいただき、ありがとうございます。