表按字母順序排序

Question

嘗試按字母順序過濾表格，以便在表格上方顯示字母列表，當用戶單擊字母時，會顯示以該字母開頭的所有術語。 腳本如下和 html 表。 我想這叫做分頁，我不確定。 我不確定我的腳本有什么問題。 我對 JS 很陌生。 字母不顯示，也沒有辦法按字母過濾。

<script>
    const alphas = 'abcdefghijklmnopqrstuvwxyz';
    let tmp = '';
    for (let x = 0; x < 26; x++) {
      tmp += `<a href="#">${alphas[x].toUpperCase()}</a>&nbsp;&nbsp;`;
    }
    $('#table_filter').append(tmp);
    $('#table_filter a').click(function () {
      if ($(this).attr('id') == 'show_all') {
        $('#filterNames tbody tr').css('display', 'table-row');
        return false;
      }
      const alpha = $(this).html();
      $('#filterNames tbody tr').hide().filter(function () {
        const td = $('td:nth-child(2)', $(this));
        return td.length && td.html() && new RegExp(`^${alpha}.*$`, 'i').test(
          td.html().toLowerCase(),
        );
      }).css('display', 'table-row');
    });
    </script><p>&nbsp;</p>
    <div id="table_filter">&nbsp;
     <a href="#" id="show_all">Show All</a>&nbsp;
    </div>
    <p>&nbsp;</p>
    
    <table class="DataTable" id="filterTerms">
        <thead>
            <tr>
                <th style="width: 25%;">Term</th>
                <th style="width:75%;">Definition</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Academic Year</td>
                <td>The 12-month period of time generally extending from September to August.</td>
            </tr>
            <tr>
                <td>Academic Program</td>
                <td>Instructional program leading toward an associate&rsquo;s, bachelor&rsquo;s, master&rsquo;s, doctor&rsquo;s, or first-professional degree or resulting in credits that can be applied to one of these degrees.</td>
            </tr>
            <tr>
                <td>Academically Disadvantaged</td>
                <td>Students who have demonstrated (either by low performance on pre-entrance tests, or by attending class and struggling with the material) an inability to succeed academically without specific counseling, tutorial support, or academic remediation.</td>
            </tr>
            <tr>
                <td>Accreditation</td>
                <td>A process signifying that an institution has a purpose appropriate to higher education, and resources, programs, and services sufficient to accomplish its purpose on a continuing basis.</td>
            </tr>
            <tr>
                <td>Accuplacer</td>
                <td>An approved assessment instrument that will allow a student to satisfy one section or all sections of the Texas Success Initiative upon passage of the section.</td>
            </tr>
            <tr>
                <td>Administrative Unit/Division</td>
                <td>A unit charged with responsibilities, relating to either administration (student or campus support and operations) or learning (curriculum and development).</td>
            </tr>
            <tr>
                <td>Admissions</td>
                <td>Applicants granted an official offer to enroll in a college or university.</td>
            </tr>
            <tr>
                <td>Admission Category</td>
                <td>Indicator of whether student is a first-time freshman, new undergraduate transfer, new post-baccalaureate, new master&rsquo;s, new special professional, new doctoral student, or a continuing/former student.</td>
            </tr>
            <tr>
                <td>African American (or Black)</td>
                <td>A person having origins in any of the black racial groups of Africa.</td>
            </tr>
            <tr>
                <td>Association for Institutional Research (AIR)</td>
                <td>The national-level organization focusing on the roles of the institutional research and institutional effectiveness. The mission of the Association for Institutional Research is to support members in their efforts to continuously improve the practice of institutional research for post-secondary planning, management and operations and to further develop and promote the institutional research profession.</td>
            </tr>
            <tr>
                <td>Alumni Surveys</td>
                <td>Questionnaires administered to undergraduate alumni to determine their satisfaction with programs and services, as well as their current educational and employment status.</td>
            </tr>
            <tr>
                <td>American Indian or Alaska Native</td>
                <td>A person having origins in any of the original peoples of North and South America (including Central America) who maintains cultural identification through tribal affiliation or community attachment.</td>
            </tr>
            <tr>
                <td>Analysis of Variance (ANOVA)</td>
                <td>A statistical test of whether or not the means of several groups are all equal, and therefore generalizes <em>t</em>-test to more than two groups.</td>
            </tr>
            <tr>
                <td>Annual Data Profile (ADP)</td>
                <td>A report (data profile) prepared by the Coordinating Board staff from college-generated data and program information to be used by the colleges to conduct institutional effectiveness self-assessments and institutional plans for new program review and program revisions. The ADP summarizes annual progress by each college toward meeting state-level goals and contains data required in institutions&rsquo; Perkins Annual Application and data for federal reporting.</td>
            </tr>
            <tr>
                <td>Annual Expenses</td>
                <td>The total expenditures associated with tuition, required fees, room, and board for a typical undergraduate student.</td>
            </tr>
            <tr>
                <td>Annual Review</td>
                <td>Informational guide containing activities from one academic year. Contents include planning initiatives, institutional effectiveness reports, data compiled from the federal IPEDS, state accountability, legislative budget board data, and various internal survey items.</td>
            </tr>
            <tr>
                <td>ASALFS (Automated Student and Adult Learner Follow-Up System)</td>
                <td>An automated process that uses employment and education databases to track community, technical, and state college program completers (both degree and certificate recipients), verifying their status of employment or further education. The follow-up system is used for program evaluation and state/federal reporting.</td>
            </tr>
            <tr>
                <td>Asian</td>
                <td>A person having origins in any of the original peoples of the Far East, Southeast Asia, or the Indian Subcontinent, including, for example, Cambodia, China, India, Japan, Korea, Malaysia, Pakistan, the Philippine Islands, Thailand, and Vietnam.</td>
            </tr>
            <tr>
                <td>Assessment</td>
                <td>1. Determining the evaluation or level of accomplishment for a pre-determined activity or objective. 2. An on-going systematic collection and review of evidence used to shape and support program and individual development.</td>
            </tr>
            <tr>
                <td>ASSET</td>
                <td>An academic skills assessment instrument approved by the Board and offered by American College Test (ACT).</td>
            </tr>
            <tr>
                <td>Associate&rsquo;s Degree</td>
                <td>An award earned by taking a minimum of 60 credits of prescribed and elective credit courses which promote both breadth and depth of knowledge. Associate degrees may be completed over a two-year period of full-time study.</td>
            </tr>
            <tr>
                <td>Attitudinal Learning</td>
                <td>A process through which the student&rsquo;s feelings or attitudes effect their learning environment and enhances or prohibits their ability to concentrate, motivate and learn.</td>
            </tr>
            <tr>
                <td>Bachelor&rsquo;s Degree</td>
                <td>An award earned by taking a minimum of 120 credits of prescribed and elective credit courses which promote both breadth and depth of knowledge. Bachelor degrees may be completed over a four-year period of full-time study.</td>
            </tr>
            <tr>
                <td>Balanced Scorecard</td>
                <td>A strategic performance management tool used by managers to keep track of various activities of the staff within their control and to monitor the consequences arising from those actions.</td>
            </tr>
            <tr>
                <td>Benchmark</td>
                <td>A point of reference or established data point upon which measurements can be made.</td>
            </tr>
            <tr>
                <td>Biennium</td>
                <td>The two-year budget period used by Texas state government. A biennium begins on September 1 of an odd-numbered year and ends on August 31 of the next odd-numbered year. Each biennium contains two state fiscal years.</td>
            </tr>
            <tr>
                <td>Black (or African American), Non-Hispanic</td>
                <td>A person having origins in any of the black racial groups of Africa.</td>
            </tr>
            <tr>
                <td>Calendar Year</td>
                <td>January 1 to December 31</td>
            </tr>
            <tr>
                <td>Capstone Course</td>
                <td>A course designed and normally offered in the final semester of a student&rsquo;s major. This course should tie together the key learning objectives that faculty expect the student to have learned while completing the program or major field of study.</td>
            </tr>
            <tr>
                <td>CBM</td>
                <td>Acronym for Coordinating Board Management Report.</td>
            </tr>
            <tr>
                <td>CBM001</td>
                <td>This report reflects all students enrolled in credit courses at the reporting institution as of the official census date, which is the 12th class day for the Fall and Spring semesters (16-week session) and the 4th class day for each of the summer terms (6-week session).</td>
            </tr>
            <tr>
                <td>Carnegie Unit</td>
                <td>Time-based references for measuring educational attainment used by American universities and colleges.</td>
            </tr>
            <tr>
                <td>Census Date</td>
                <td>The official day of record that public higher education institutions must determine the enrollments that qualify to be reported to the Coordinating Board for state reimbursement. Also referred to as Official Reporting Date (ORD). For fall and spring semesters, it is the 12th class day. For summer semesters, it is the 4th class day.</td>
            </tr>
            <tr>
                <td>Certificate</td>
                <td>A formal award certifying the satisfactory completion of a post-secondary education program.</td>
            </tr>
            <tr>
                <td>Certificate Level 2</td>
                <td>An award conferred by a post-secondary institution to recognize the successful completion of a program of studies having 30 or more but less than 60 student credit hours (SCH).</td>
            </tr>
            <tr>
                <td>Certificate Level 2</td>
                <td>A workforce education program of study that consists of at least 43 and no more than 59 semester credit hours (64-89 quarter hours). Level 2 Certificates are subject to the requirements of the Texas Success Initiative.</td>
            </tr>
            <tr>
                <td>Certificate Level 1</td>
                <td>An award conferred by a post-secondary institution to recognize the successful completion of a program of studies having 29 student credit hours (SCH) or less.</td>
            </tr>
            <tr>
                <td>Certificate Level 1</td>
                <td>A workforce education program of study that consists of at least 15 and no more than 42 semester credit hours (23-63 quarter hours). Level I certificate programs are exempt from the requirements of the Texas Success Initiative, although all certificate programs must provide for local assessment and remediation of students.</td>
            </tr>
            <tr>
                <td>Certificate Program</td>
                <td>A technical program designed for entry-level employment or for upgrading skills and knowledge within an occupation. Certificate programs serve as building blocks and exit points for AAS degree programs.</td>
            </tr>
            <tr>
                <td>CIP Code</td>
                <td>A six digit code in the format of 00.0000 that identifies instructional program specialties within educational institutions. A CIP code is assigned to each program at the time it is established.</td>
            </tr>
            <tr>
                <td>CIP Code</td>
                <td>THECB adds an additional two digits on to the state level codes making the state level CIP an eight digit code, however the first six digits are maintained in conformity with the federal level CIP coded system.</td>
            </tr>
            <tr>
                <td>Classification</td>
                <td>Eight groupings based upon semester credit hours successfully completed and degree pursued [e.g., Freshman (0-29 hours); Sophomore (30-59 hours); Junior (60-89 hours); Senior (90+ hours); Master&rsquo;s (pursing a master&rsquo;s degree); Doctoral (pursuing a doctoral degree)]</td>
            </tr>
            <tr>
                <td>Cognition</td>
                <td>The process of acquiring, creating, and disseminating knowledge.</td>
            </tr>
            <tr>
                <td>Cognitive Learning</td>
                <td>The process of gaining knowledge through thought or perception. A technique that enables students to learn by using their sense of reasoning, their intuition and their own sense of perception.</td>
            </tr>
            <tr>
                <td>Cohort</td>
                <td>A grouping of students who share a statistical factor (age, ethnicity, academic standing, class membership) in common in a demographic study</td>
            </tr>
            <tr>
                <td>College Navigator</td>
                <td>Information source designed to help students, parents, advisors/counselors, and others get information about post-secondary institutions. Part of the National Center for Educational Statistics (NCES).</td>
            </tr>
            <tr>
                <td>Common Data Set</td>
                <td>A detailed report covering institution-wide information. Data are presented in the same &ldquo;common&rdquo; format used by most institutions of Higher Education to facilitate comparisons among institutions.</td>
            </tr>
            <tr>
                <td>College Ready</td>
                <td>(1) The student who has enrolled into a college and has no requirement to enroll in any developmental courses prior to enrolling in college-level math or English courses. (2) The student who has completed all developmental courses.</td>
            </tr>
            <tr>
                <td>COMPASS</td>
                <td>An academic skills assessment instrument approved by the Board and offered by American College Test (ACT).</td>
            </tr>
            <tr>
                <td>Completer</td>
                <td>A student who receives a degree, diploma, certificate, or other formal award. In order to be considered a completer, the degree/award must actually be conferred.</td>
            </tr>
            <tr>
                <td>Completers within 150% (OF NORMAL TIME)</td>
                <td>Students (within a cohort or sub-cohort) who completed their program within 150% of the normal time to completion. For example, a student enrolled in an Associate program would complete the program within 3 years to meet the 150% rule.</td>
            </tr>
            <tr>
                <td>Contact Hour</td>
                <td>A unit of measure that represents an hour of scheduled instruction given to students.</td>
            </tr>
            <tr>
                <td>Consortium</td>
                <td>An association of two or more individuals, companies, or organizations (or any combination of thereof) with the objective of participating in a common activity or pooling their resources for achieving a common goal.</td>
            </tr>
            <tr>
                <td>Continuing Education</td>
                <td>(1) A course or activity having no credit applicable toward a degree, diploma, certificate, or other formal award. (2) A Coordinating Board approved higher education technical course offered for continuing education units and conducted in a competency-based format.</td>
            </tr>
            <tr>
                <td>Core Curriculum</td>
                <td>The common part of every undergraduate curriculum that introduces students to a broad range of knowledge areas beyond their major and helps students develop basic intellectual competencies in reading, writing, speaking, listening, critical thinking, and computer literacy.</td>
            </tr>
            <tr>
                <td>Course Completers</td>
                <td>Individuals who are enrolled in credit awarding course on the day of census and remain continuously enrolled until the course completion date.</td>
            </tr>
            <tr>
                <td>Course Credit</td>
                <td>Course credit is a measure of the content (skills and/or knowledge) in a course. The expert authority with regard to course content and proposing credit value is the department responsible for designing the course.</td>
            </tr>
            <tr>
                <td>Course-based Assessment</td>
                <td>Techniques or methods used to measure student learning within the classroom environment.</td>
            </tr>
            <tr>
                <td>Credit Hour</td>
                <td>A unit of measure representing an hour (50 minutes) of instruction over a 15-week period in a semester system or a 10-week period in a quarter system. It is applied toward the total number of hours needed for completing the requirements of a degree, diploma, certificate or other formal award.</td>
            </tr>
            <tr>
                <td>Current Funds Expenditures (and Transfers)</td>
                <td>The costs incurred for goods and services used in the conduct of the institution&rsquo;s operations. Includes the acquisition cost of capital assets, such as equipment and library books, to the extent current funds are budgeted for and used by operating departments for such purposes.</td>
            </tr>
        </tbody>
    </table>

Answer 1

這應該將一組 span 元素添加到#table_filter 。 每個跨度都將使用取自String.fromCharCode()的字母命名。 單擊 function 也會添加到每個跨度。 單擊跨度時，它將循環遍歷表格主體的子項，並添加/刪除 class 以隱藏表格行。

 // wait for DOM to load $(document).ready(function(){ // cycle through ASCII AZ values for (let i = 65; i < 91; i++) { $("<span>") // create <span> element.text(String.fromCharCode(i)) // add letter to <span>.click(function() { // add filter function const letter = this.textContent; // letter of <span> button // function cycles through all <tr> elements $('tbody').children().each(function() { // if first letter of <td> child matches <span> button if (this.firstChildElement.textContent.substring(0,1).toUpperCase() == letter) { // remove.hidden class $(this).removeClass('hidden'); } else { // else add.hidden class $(this).addClass('hidden'); } }); }).appendTo("table_filter"); // append everything to #table_filter element } });