<div><img src="/static/imghw/default1.png" data-src="http://files.jb51.net/upload/201103/20110320232752663.bmp" class="lazy" onclick='window.open("http://blog.51cto.com/viewpic.php?refimg=" this.src)' alt="" onload="if(this.width>650) this. style="max-width:90%" border="0"></div> <div> </div> <div><img src="/static/imghw/default1.png" data-src="http://files.jb51.net/upload/201103/20110320232753596.bmp" class="lazy" onclick='window.open("http://blog.51cto.com/viewpic.php?refimg=" this.src)' alt="" onload="if(this.width>650) this. style="max-width:90%" border="0"></div> <div> </div> <div> </div> <div>コードは非常に簡単です。添付ファイルにあるので、ダウンロードして直接実行できます。<br><div class="codetitle"> <span><a style="CURSOR: pointer" data="90203" class="copybut" id="copybut90203" onclick="doCopy('code90203')"><u>コードをコピーします</u></a></span>コードは次のとおりです。</div> <div class="codebody" id="code90203"> <br><script type="text/javascript" language="javascript"> <br>$(function() { <br>jQuery.fn.alternateRowColors = function () { //プラグインにします。フォーム<br>$('tbody tr:odd', this).removeClass('even').addClass('odd'); //奇数行は 1 行おきに色を変更します。 row<br>$('tbody tr:even', this ).removeClass('odd').addClass('even'); //偶数行は 1 行おきに色を変更します<br>return this>}; <br>$('table.myTable').each(function() { <br>var $table = $(this); //jquery オブジェクトとしてのストレージ テーブル<br>$table.alternateRowColors($table); //ソート時に代替行の色が変わります<br>$('th', $table).each(function(column) { <br>var findSortKey; <br>if ($(this).is('.sort- alpha')) { //アルファベット順に並べ替えます<br>findSortKey = function( $cell) { <br>return $cell.find('sort-key').text().toUpperCase() '' $cell.text( ).toUpperCase(); <br>}; <br>} else if ($(this).is('.sort-numeric')) { //数値的に並べ替えます<br>findSortKey = function($cell) { <br>var key = parseFloat($cell.text().replace (/^[^d.]*/, '')); <br>return isNaN(key) ? <br>}; 🎜>} else if ($(this).is('.sort-date')) { //日付で並べ替えます<br>findSortKey = function($cell) { <br>return Date.parse('1 ' $ cell.text()); <br>}; <br> } <br>if (findSortKey) { <br>$(this).addClass('clickable').hover(function() { $(this). addClass('hover'); }, function() { $(this).removeClass('hover'); }).click(function() { <br>//逆ソートステータスステートメント<br>var newDirection = 1 ; <br>if ($(this).is(' .sorted-asc')) { <br>newDirection = -1; <br>} <br>var rows = $table.find('tbody>tr' ).get(); //データ行を配列に変換します <br>$.each(rows, function(index, row) { <br>row.sortKey = findSortKey($(row).children('td'). eq(column)); <br>}); <br>rows.sort(function(a, b) { <br>if (a.sortKey < b.sortKey) return -newDirection; <BR>if (a .sortKey > b.sortKey) return newDirection <br>return <br>}); <br>$.each(rows, function(index, row) { <br>$table.children('tbody') ).append(row); <br>row.sortKey = null <br>$table.find('th').removeClass('sorted-desc'); '); <br>var $sortHead = $table.find('th').filter(':nth-child(' (column 1) ')'); <br>// 逆ソートを実装します<br> (newDirection == 1) { <br>$sortHead .addClass('sorted-asc'); <br>} else { <br>$sortHead.addClass('sorted-desc'); <br> //インターレースカラー関数を呼び出します<br>$table .alternateRowColors($table); <br>//並べ替えられた列のスタイルを削除し、現在の列にスタイルを追加します <br>$table.find('td' ).removeClass('sorted').filter(': nth-child(' (列 1) ')').addClass('sorted'); <br>$table.trigger('repaginate'); }); <br>} <br>}); <br>//ページング<br>$('table.paginated' ).each(function() { <br>var currentPage = 0; <br>var numPerPage = 10; <br>var $table = $(this); <br>$table.bind('repaginate', function( ) { <br>$table.find('tbody tr ').hide().slice(currentPage * numPerPage, (currentPage 1) * numPerPage).show(); <br>var numRows = $table.find('tbody tr').length; <br>var numPages = Math.ceil(numRows / numPerPage); <br>var $pager = $('<div class="pager">< /div>'); <br>for (var page = 0; page < numPages; page ) { <BR>$('<span class="page-number"></span>')。 text(ページ 1) <br>.bind('click ', { newPage: page }, function(event) { <br>currentPage =event.data['newPage']; <br>$table.trigger('repaginate) '); <br>$(this).addClass( 'active').siblings().removeClass('active'); <br>}).appendTo($pager).addClass('clickable'); >} <br>$pager.insertBefore($table) ; <br>$table.trigger('repaginate'); <br>$pager.find('span.page-number:first').addClass('active '); <br>}); <br>} ); <br><br><br><br> パッケージのダウンロード アドレス</div> </div>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
