亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

為什么單擊相應元素時該功能不起作用?

為什么單擊相應元素時該功能不起作用?

www說 2022-12-29 14:04:18
// PART 1 -- CREATING THE TABLE USING ARRAYlet table_elements = [    ["Krishna", 3, 47.3],    ["Robert", 2, 47.4],    ["Jennifer", 4, 82],    ["Dekisugi", 1, 71],    ["Muhammad", 5, 68]];let getTable = document.getElementsByTagName("table")[0];window.onload = () => {    getTableData();}function getTableData(){    table_elements.forEach((value, index) => {        let tr = document.createElement("tr");        for(let x=0; x<table_elements[0].length; x++)        {            let td = document.createElement("td");            td.innerHTML = table_elements[index][x];            tr.appendChild(td);        }        getTable.appendChild(tr);    });}// PART 2 -- SORTING THE VALUES UPON SELECT AN OPTIONfunction sortByCategory(n){    n = n.selectedIndex; /* value of n must be 1 in this case */    // console.log(n);    let isString = typeof table_elements[0][n-1];    // console.log(isString);    var sortingOrder = document.getElementById("sortingOrder").value;    if(isString == "string")    {        if(sortingOrder == "Ascending")        table_elements.sort();        else        table_elements.sort().reverse();    }    else    {        if(sortingOrder == "Ascending"){            table_elements.sort(function (a, b) {                return a[n-1] - b[n-1];            });        }        else{            table_elements.sort(function (a, b) {                return b[n - 1] - a[n - 1];            });        }    }    for(let y=1; y<table_elements.length + 1; y++){            let getTR = getTable.getElementsByTagName("tr")[y];                    for(let z=0; z<table_elements[0].length; z++){            let getTD = getTR.getElementsByTagName("td")[z];            getTD.innerHTML= table_elements[y-1][z];        }    }在此代碼中一切正常,但我需要將表格元素排序為升序或降序。因此,當我選擇升序或降序時,它應該根據事件進行排序。但我需要再次點擊按類別排序選項,然后它才起作用。當我選擇升序或降序時,我嘗試運行函數 sortbycategory。但它仍然不起作用。試試代碼,你就會明白我在說什么。那么我怎樣才能擺脫這個呢?
查看完整描述

1 回答

?
江戶川亂折騰

TA貢獻1851條經驗 獲得超5個贊

// PART 1 -- CREATING THE TABLE USING ARRAY


let table_elements = [

  ["Krishna", 3, 47.3],

  ["Robert", 2, 47.4],

  ["Jennifer", 4, 82],

  ["Dekisugi", 1, 71],

  ["Muhammad", 5, 68]

];


let getTable = document.getElementsByTagName("table")[0];


window.onload = () => {

  getTableData();

}


function getTableData() {

  table_elements.forEach((value, index) => {

    let tr = document.createElement("tr");

    for (let x = 0; x < table_elements[0].length; x++) {

      let td = document.createElement("td");

      td.innerHTML = table_elements[index][x];

      tr.appendChild(td);

    }

    getTable.appendChild(tr);

  });

}


// PART 2 -- SORTING THE VALUES UPON SELECT AN OPTION

var sortingOrder = 'Ascending'

var sn = 0


function sortByCategory(n = null) {

  let isString = null

  if(n){

     n = n.selectedIndex; /* value of n must be 1 in this case */

     console.log("value of ",n);

     sn = n-1

     isString = typeof table_elements[0][n - 1];

     // console.log(isString);

   }

  if (isString == "string") {

    if (sortingOrder == "Ascending")

       table_elements.sort();

     else

       table_elements.sort().reverse();

   } 

  else {

    if (sortingOrder == "Ascending") {

         if (sn === 0) {

            table_elements.sort(function(a, b) {

             if (a[sn] > b[sn]) {

              return 1

            } else if (b[sn] > a[sn]) {

               return -1

            } else {

              return 0

            }

           });

          }

            else {

             table_elements.sort(function(a, b) {

               return a[sn] - b[sn];

             }); }

          

       } 

   

   else {

         console.log('descending' ,sn)

          if (sn === 0) {

             table_elements.sort(function(a, b) {

             if (a[sn] > b[sn]) {

              return -1

             } else if (b[sn] > a[sn]) {

              return 1

             } else {

              return 0

             }

            });

          }

       else {

             table_elements.sort(function(a, b) {

               return b[sn] - a[sn];

             });

        }

    }


}

for (let y = 1; y < table_elements.length + 1; y++) {


  let getTR = getTable.getElementsByTagName("tr")[y];


  for (let z = 0; z < table_elements[0].length; z++) {

    let getTD = getTR.getElementsByTagName("td")[z];

    getTD.innerHTML = table_elements[y - 1][z];

  }

}


}


function sortTable(order) {

  sortingOrder = order.value

  sortByCategory()

}

<select onchange="sortByCategory(this)">

  <option value="--SORT BY CATEGORY--" selected disabled>--SORT BY CATEGORY--</option>

  <option value="Sort by Name">Sort by Name</option>

  <option value="Sort by Roll No.">Sort by Roll No.</option>

  <option value="Sort by Attendance">Sort by Attendance</option>

</select>

<select id="sortingOrder" onchange="sortTable(this)">

  <option value="Ascending">Ascending</option>

  <option value="Descending">Descending</option>

</select>

<table>

  <tr>

    <th>Name</th>

    <th>Roll No.</th>

    <th>Attendance</th>

  </tr>

</table>


查看完整回答
反對 回復 2022-12-29
  • 1 回答
  • 0 關注
  • 80 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號