ホームページ > 記事 > ウェブフロントエンド > jqueryでコールバックメソッドを使う方法

jqueryでコールバックメソッドを使う方法

WBOYオリジナル: 2022-05-18 17:03:182105ブラウズ

jquery では、エフェクトメソッドのパラメータとしてコールバックメソッドを渡します。このメソッドは、現在のアクションが完全に完了した後に実行されます。通常、メソッドの最後のパラメータとして表示されます。構文は「$(セレクター).hide (デュレーション、イージング、コールバック);」です。

このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。

jquery でコールバックメソッドを使用する方法

JavaScript ステートメントを 1 行ずつ実行します。ただし、jQuery エフェクトは完了までに時間がかかるため、前のエフェクトの実行中に次のコード行が実行される可能性があります。これによりエラーが発生します。

これを防ぐために、jQuery は各エフェクトメソッドにコールバック関数を提供します。

現在のエフェクトが完了すると、コールバック関数が実行されます。

コールバック関数は引数としてエフェクトメソッドに渡され、通常はメソッドの最後の引数として表示されます。

一般的な構文: $(selector).hide(duration, easing, callback);

次の例にはコールバックパラメーターがあり、これは非表示効果が解除された後に実行される関数です。完了:

例は次のとおりです:

<!DOCTYPE html>
<html>
<title>jQuery 使用回调函数示例</title>
<head>
<script src="js/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide("slow", function(){
      alert("段落现在隐藏起来了");
    });
  });
});
</script>
</head>
<body>
<button>隐藏</button>
<p>这是一个段落。</p>
</body>
</html>

出力結果:

jqueryでコールバックメソッドを使う方法