当您点击页面顶部的链接时，我有一个页面使用JavaScript来显示/隐藏div。在每个div中，我有一个使用jQuery tablesorter的表。
zebra小部件正在处理加载时显示的表，但它不适用于任何其他表。当我使用Chrome检查元素时，它会显示第一个表的行被归类为奇数或偶数，但其他表中的行不显示此分类。我不确定为什么其他桌子会失去这个。
这是我的代码：
JSFiddle：http://jsfiddle.net/wy7Pq/1/
JavaScript的：
$(document).ready(function() {
$('#finance_link').click(function() {
$('#rank2_display').hide();
$('#rank3_display').hide();
$('#rank4_display').hide();
$('#rank5_display').hide();
$('#rank1_display').show();
$("#finance_link").parent().addClass("active");
$("#students_link").parent().removeClass("active");
$("#other_link").parent().removeClass("active");
$("#planning_link").parent().removeClass("active");
$("#children_link").parent().removeClass("active");
return false;
}); // end click function
$('#students_link').click(function() {
$('#rank1_display').hide();
$('#rank3_display').hide();
$('#rank4_display').hide();
$('#rank5_display').hide();
$('#rank2_display').show();
$("#finance_link").parent().removeClass("active");
$("#students_link").parent().addClass("active");
$("#other_link").parent().removeClass("active");
$("#planning_link").parent().removeClass("active");
$("#children_link").parent().removeClass("active");
return false;
}); // end click function
$('#other_link').click(function() {
$('#rank1_display').hide();
$('#rank2_display').hide();
$('#rank3_display').show();
$('#rank4_display').hide();
$('#rank5_display').hide();
$("#finance_link").parent().removeClass("active");
$("#students_link").parent().removeClass("active");
$("#other_link").parent().addClass("active");
$("#planning_link").parent().removeClass("active");
$("#children_link").parent().removeClass("active");
return false;
}); // end click function
$('#planning_link').click(function() {
$('#rank1_display').hide();
$('#rank2_display').hide();
$('#rank3_display').hide();
$('#rank4_display').show();
$('#rank5_display').hide();
$("#finance_link").parent().removeClass("active");
$("#students_link").parent().removeClass("active");
$("#other_link").parent().removeClass("active");
$("#planning_link").parent().addClass("active");
$("#children_link").parent().removeClass("active");
return false;
}); // end click function
$('#children_link').click(function() {
$('#rank1_display').hide();
$('#rank2_display').hide();
$('#rank3_display').hide();
$('#rank4_display').hide();
$('#rank5_display').show();
$("#finance_link").parent().removeClass("active");
$("#students_link").parent().removeClass("active");
$("#other_link").parent().removeClass("active");
$("#planning_link").parent().removeClass("active");
$("#children_link").parent().addClass("active");
return false;
}); // end click function
});;
$(function() {
$('table').tablesorter({
theme: 'blue',
widgets: ['zebra'],
sortList: [[0, 0]],
headers: {
0: {
sorter: 'ignoreArticles',
ignoreArticles : 'en'
}
}
});
});
HTML：
<div id="eresources_block">
<h3>Choose a Category to Browse Books by Topic</h3>
<ul id="rank_menu">
<li class="active"><a id="finance_link" href="rank=1">Personal Finance</a></li>
<li><a id="students_link" href="rank=2">College Students/Graduates</a></li>
<li><a id="planning_link" href="rank=4">College Planning/Financial Aid</a><br>
<br></li>
<li><a id="other_link" href="rank=3">Other Groups</a></li>
<li><a id="children_link" href="rank=5">For Children & Teenagers</a></li>
</ul>
<div id="rank1_display" class="show_rank">
<h4>Basic Personal Finance</h4>
<table id="basic" class="tablesorter">
<thead>
<tr>
<th scope="col"><strong>Title</strong></th>
<th scope="col"><strong>Call Number</strong></th>
<th scope="col"><strong>Audience</strong></th>
<th scope="col"><strong>Topics</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><em><strong>Basic Budgeting: The Simple Way for Anyone and Everyone to Be in Control of Their Finances</strong></em></td>
<td> <a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002331959" target="_blank">HG179 .M5 2010</a></td>
<td>Everyone</td>
<td>Budgeting</td>
</tr>
<tr>
<td><em><strong>The Only Budgeting Book You'll Ever Need</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002209478" target="_blank">HG179 .D7433 2012</a></td>
<td>Everyone</td>
<td>Budgeting</td>
</tr>
<tr>
<td><em><strong>The Skinny on Credit Cards: How to Master the Credit Card Game</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001725956" target="_blank">HG3755.8.U6 R36 2009</a></td>
<td>Everyone</td>
<td>Credit cards</td>
</tr>
<tr>
<td><em><strong>Your Credit Score: How to Improve the 3-Digit Number That Shapes Your Financial Future</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001929742" target="_blank">HG3751.7 .W47 2012</a></td>
<td>Everyone</td>
<td>Credit score</td>
</tr>
<tr>
<td><em><strong>Deal with Your Debt: Free Yourself From What You Owe</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002333124" target="_blank">HG3755 .W44 2013</a></td>
<td>Everyone</td>
<td>Debt management</td>
</tr>
</tbody>
</table>
</div>
<div id="rank2_display" class="hide_rank">
<h4>College Students and Graduates</h4>
<table id="college" class="tablesorter">
<thead>
<tr>
<th scope="col"><strong>Title</strong></th>
<th scope="col"><strong>Call Number</strong></th>
<th scope="col"><strong>Audience</strong></th>
<th scope="col"><strong>Topics</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><em><strong>Gradspot.com's Guide to Life After College</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001805231" target="_blank">HQ2037 .K54 2011</a></td>
<td>Graduates</td>
<td>Life skills; Jobs; Basic personal finance</td>
</tr>
<tr>
<td><em><strong>Street Smarts: Beyond the Diploma</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001924708" target="_blank">HF5382.7 .R363 2011</a></td>
<td>Graduates</td>
<td>Life skills; Jobs; Basic personal finance</td>
</tr>
<tr>
<td><em><strong>CliffsNotes Graduation Debt: How to Manage Student Loans and Live Your Life</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002332043" target="_blank">LB2340 .G63 2014</a></td>
<td>Graduates</td>
<td>Student loans; Debt management</td>
</tr>
<tr>
<td><em><strong>This is Not Your Father's Job Market: Job Seeking Strategies for Today's New College Graduates</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002211864" target="_blank">HF5382.7 .K666 2012</a></td>
<td>Graduates</td>
<td>Jobs</td>
</tr>
<tr>
<td><em><strong>Automatic Wealth for Grads... and Anyone Else Just Starting Out</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001322455" target="_blank">HG179 .M315 2006</a></td>
<td>Graduates</td>
<td>Basic personal finance; Saving; Jobs; Investing; Taxes</td>
</tr>
</tbody>
</table>
</div>
<div id="rank3_display" class="hide_rank">
<h4>Other Groups</h4>
<table id="other" class="tablesorter">
<thead>
<tr>
<th scope="col"><strong>Title</strong></th>
<th scope="col"><strong>Call Number</strong></th>
<th scope="col"><strong>Audience</strong></th>
<th scope="col"><strong>Topics</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><em><strong>Emotional Currency: A Woman's Guide to Building a Healthy Relationship with Money</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002345080" target="_blank">HG179 .L472 2011</a></td>
<td>Women</td>
<td>Money philosophy</td>
</tr>
<tr>
<td><em><strong>Money Girl's Smart Moves to Grow Rich</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001749947" target="_blank">HG179 .A323 2011</a></td>
<td>Women</td>
<td>Basic personal finance; Money management; Debt management; Investing; Retirement; College planning; Taxes</td>
</tr>
<tr>
<td><em><strong>On My Own Two Feet: A Modern Girl's Guide to Personal Finance</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002345081" target="_blank">HG179 .T44 2014</a></td>
<td>Women</td>
<td>Basic personal finance; Saving; Credit cards; Insurance; Budgeting; Investing; Retirement; Student loans; Taxes</td>
</tr>
<tr>
<td><em><strong>From Ramen to Riches: Finding a Job in Your 20s: A Young Professional's Guide to Career Search, Networking, Resume Writing, Interviewing, and Succeeding at Work</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002345101" target="_blank">HF5382.7 .T363 2012</a></td>
<td>Young adults</td>
<td>Jobs</td>
</tr>
<tr>
<td><em><strong>From Ramen to Riches: Building Wealth in Your 20s: Or Spending, Saving, Investing and Managing Your Money to Get Rich Slowly, but Surely</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002345098" target="_blank">HG179 .W66 2010</a></td>
<td>Young adults</td>
<td>Basic personal finance; Saving; Investing; Money management</td>
</tr>
</tbody>
</table>
</div>
<div id="rank4_display" class="hide_rank">
<h4>College Planning and Financial Aid</h4>
<table id="finaid" class="tablesorter">
<thead>
<tr>
<th scope="col"><strong>Title</strong></th>
<th scope="col"><strong>Call Number</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><strong><em>College Solution: A Guide for Everyone Looking for the Right School at the Right Price</em></strong></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001992920" target="_blank">LB2343.32 .O82 2012</a></td>
</tr>
<tr>
<td><strong><em>Confessions of a Scholarship Winner</em></strong></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002188400" target="_blank">LB2337.4 .E45 2013</a></td>
</tr>
<tr>
<td><strong><em>Financial Aid Handbook: Getting the Education You Want for the Price You Can Afford</em></strong></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001811452" target="_blank">LB2337.4 .S68 2011</a></td>
</tr>
<tr>
<td><strong><em>Getting Financial Aid</em></strong></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002218632" target="_blank">LB2337.2 .G47 2014</a></td>
</tr>
<tr>
<td><strong><em>Getting In: The Zinch Guide to College Admissions and Financial Aid in the Digital Age</em></strong></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002332083" target="_blank">LB2351.2 .G4843 2011</a></td>
</tr>
<tr>
<td><strong><em>How to Get Money for College: Financing Your Future Beyond Federal Aid 2015</em></strong></td>
<td><strong>NOT YET PUBLISHED</strong></td>
</tr>
</table>
</div>
<div id="rank5_display" class="hide_rank">
<h4>For Children and Teenagers</h4>
<table id="childrens" class="tablesorter">
<thead>
<tr>
<th scope="col"><strong>Title</strong></th>
<th scope="col"><strong>Call Number</strong></th>
<th scope="col"><strong>Grade Level</strong></th>
<th scope="col"><strong>Topics</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><em><strong>Do I Need It? Or Do I Want It? Making Budget Choices</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002328192" target="_blank"><strong>JUV</strong> HG179 .L267 2010</a></td>
<td>K - 2</td>
<td>Budgeting; Decision making; Goal setting; Saving; Spending</td>
</tr>
<tr>
<td><em><strong>Fancy Nancy and the Fabulous Fashion Boutique</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=001806573" target="_blank">PZ7.O222 Fhp 2010</a></td>
<td>Pre - 2</td>
<td>Earning money; Goal setting; Problem solving</td>
</tr>
<tr>
<td><em><strong>Isabel's Car Wash</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002328194" target="_blank">PZ7.B1617 Is 2008</a></td>
<td>K - 4</td>
<td>Earning money; Goal setting; Problem solving; Saving</td>
</tr>
<tr>
<td><em><strong>Kids Making Money: An Introduction to Financial Literacy</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002328196" target="_blank"><strong>JUV</strong> HF5392 .R49 2013</a></td>
<td>K - 2</td>
<td>Earning money; Decision making; Goal setting</td>
</tr>
<tr>
<td><em><strong>Money Mama & the Three Little Pigs</strong></em></td>
<td><a href="http://www.linccweb.org/catalog?screen=direct&lib_code=FLCC2500&query=002328215" target="_blank">PZ7.M1986346 Mon 2004</a></td>
<td>Pre - 2</td>
<td>Saving; Investing; Decision making; Budgeting; Giving & charity</td>
</tr>
</tbody>
</table>
</div>
</div>
我需要做些什么才能让zebra小部件在其他表上运行？
我搜索过这个网站和谷歌在多个表格中使用斑马小部件，但我认为我隐藏的div会使问题复杂化。
非常感谢任何帮助。
答案 0 :(得分：0)
我对JSFiddle的更新进行了更新，我认为您希望它实际执行此操作。
我还简化了您的javascript并修复了一些其他问题，这些问题导致它在HTML中完全不起作用，即您的href="rank=<number>"。