ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery関連のイベント操作の分解controls_jquery

jQuery関連のイベント操作の分解controls_jquery

WBOY
WBOYオリジナル
2016-05-16 18:48:51990ブラウズ

今日、急に彼の事件に興味が湧いたのですが、まだ解決していません。時間ができたら調べてみます。

jQuery は、コントロール イベントに関して、バインディング、ワンタイム バインディング、トリガーなどを含む豊富なメソッドを提供しています。今朝は、Prawn Lugu がうまく機能するかどうかを見てみましょう。

jQuery のバインディング イベントには、bind、live、one があり、コントロールの onclick イベントなどの一般的に使用されるイベントを分離するのに役立ちます。

コードをコピー コードは次のとおりです:

$("#testButton").click (function( ) {
alert("I'm Test Button");
});

このようにして、onclick イベントを testButton ボタンにバインドし、警告声明。 $("#testButton").click(); を使用してこの onclick イベントをトリガーすることもできます。すべて問題ありません。上記は少しいい加減なので、次にキャンセルイベントを見てみましょう。 jQuery には unbind メソッドがあり、特にバインドを解除する、つまりイベントをキャンセルするために使用されます。 $("#testButton").unbind("click"); これは非常に良さそうです。クリック イベントに 2 つのイベントがある場合は、unbind("click", fnName) を使用して特定の関数のバインドを削除することもできます。特定の関数をキャンセルするこの方法があるのはなぜですか? 例を見てみましょう。イベントのバインディングはオーバーライドされるのではなく、スーパーインポーズ (=) されることがわかります。
コードをコピー コードは次のとおりです。

var Eat = function() {
alert( "食べたい");
}

var PayMoney = function() {
alert("先に支払う");

jQuery (ドキュメント) .ready(function() {
$("#testButton").click(Eat);
$("#testButton").bind("click", PayMoney);
} );

上記の例では、最初に「食べたい」が表示され、次に「最初に支払う」が表示され、そのバインディングが onclick =fn によって実行されることがわかりました。 。準備ができたメソッドを変更しましょう:

コードをコピーします コードは次のとおりです:
jQuery( document).ready(function() {
$("#testButton").click(Eat);
$("#testButton").unbind();
$("#testButton") .bind( "click", PayMoney);
});

またエラーが発生しました。はは、今度はボタンをクリックすると PayMoney だけが実行され、Eat は実行されません。次に unbind() を実行すると、bind の後にこのボタンが配置された場合、このボタンは機能しません。しかし、バインドされた PayMoney メソッドを削除したい場合はどうすればよいでしょうか?このとき、次のように記述する必要があります:

コードをコピーします コードは次のとおりです:
jQuery(document).ready(function() {
$("#testButton").click(Eat);
$("#testButton").bind("click", PayMoney);
$("#testButton ").unbind("click", PayMoney);
});

実は、bind と同じですが、次にバグが発生します (カウントされるかどうかはわかりません 計算)、間近で体験してみましょう

コードをコピー コードは次のとおりです:
">
jQuery(document).ready(function() {
$("#testButton").unbind("click", Eat);
$("#testButton").unbind( );
$("#testButton" ).bind("click",
});



何が表示されると思いますか?食事はありますか?支払う?答えは「食べる→PayMoney」です! ! !ここでバインドをキャンセルし、特定のバインドを削除したのに、Eat がまだ実行されるのはなぜですか?この理由は、jQuery クラス ライブラリに依存すると思いますが、JQuery を介してバインドされたイベントのみが削除されると思います。では、このとき何をすべきでしょうか?幸いなことに、jQuery には多くのメソッドがあり、そのうちの 1 つは attr で、Dom 要素の属性を操作します。attr を使用して入力のクリック イベントを排除します。 $("#testButton").attr("onclick", ""); これにより、onclick イベントがクリアされます。attr は要素の属性であるため、ここでは click の代わりに「onclick」と記述する必要があります。 jQueryカプセル化の略称。さて、これがバインディングです。これが皆さんに覚えておいていただきたいシーンです。ある日、ラオ・イン、ラオ・ザオ、ラオ・チェンは食事に出かけました。その時、彼らは満腹で、お金を支払う準備ができていました。
コードをコピー コードは次のとおりです。