ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery は、row_jquery をクリックすることで HTML テーブルの行を削除する機能を実装します。

jQuery は、row_jquery をクリックすることで HTML テーブルの行を削除する機能を実装します。

WBOY
WBOYオリジナル
2016-05-16 16:33:201420ブラウズ

jQuery は、これまでで最も使用され、お気に入りの JavaScript フレームワークの 1 つになりました。これにより、JavaScript でのコーディングに伴う単純な技術的オーバーヘッドが軽減されるだけでなく、コードのクロスブラウザー互換性も確保されます。私は jQuery に関する多くのチュートリアルを書いてきましたが、このときもこの単純な純粋な実装を使用しました。このタスクは、行の行をクリックするだけで、HTML テーブルからいくつかのファンキーな効果を使用することです。以下はこれを実現するための jQuery コードです。

$(document).ready(function() {
$("#sample tr").click(function() {
//change the background color to red before removing
$(this).css("background-color","#FF3700"); 
$(this).fadeOut(400, function(){ 
$(this).remove();
});
});
});

上記のコードでは、「#example」テーブル内のすべての「TR」にハンドラーをアタッチしました。それをクリックすると、最初に行の背景が変更され、次にフェードアウトして削除されます。これは簡単な作業です。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。