Показать сообщение отдельно
  #6 (permalink)  
Старый 12.01.2020, 18:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,071

Zabuza9090,

<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
</head>
<body>
    Число строк:
    <input id="str" type="text" value="" maxlength="3" size="10" onkeyup="this.value=this.value.replace(/[^0-9]+/g,''); isright(this);" />
    Число столбцов:
    <input id="slb" type="text" value="" maxlength="3" size="10" onkeyup="this.value=this.value.replace(/[^0-9]+/g,''); isright(this);" />
    <button id="create">Создать таблицу</button>
    <style>
      td {
        border: 1px solid black;
        width: 70px;
        height: 10px;
      }
    </style>
    <script type="text/javascript">
        function isright(obj)
        {
        if (obj.value>100) obj.value=100;
        if (obj.value<0) obj.value=0;
        }

      document.getElementById("create").onclick = function() {
        var a, b, tableElem, rowElem, colElem;

        a = document.getElementById("str").value;
        b = document.getElementById("slb").value;

        if (a == "" || b == "") {
          alert("Пожалуйста введите кол-во строк и столбцов от 0 до 100");
        } else {
          tableElem = document.createElement("table");

          for (var i = 0; i < a; i++) {
            rowElem = document.createElement("tr");

            for (var j = 0; j < b; j++) {
              colElem = document.createElement("td");
              colElem.innerHTML = [Math.round(Math.random()*100)];
              rowElem.appendChild(colElem);
            }

            tableElem.appendChild(rowElem);
          }
          columnSorting(tableElem)
          document.body.appendChild(tableElem);
        }
      };
      function columnSorting(table)
      {  var sortingVector = {};
         table.addEventListener("click", ({target}) => {
                const {cellIndex : index} = target;
                const order = (sortingVector[index] = -(sortingVector[index] || -1));
                const collator = new Intl.Collator(["en", "ru"], {numeric: true});
                const comparator = (index, order) => (a, b) => order * collator.compare(
                    a.children[index].textContent,
                    b.children[index].textContent
                );
                table.append(...[...table.rows].sort(comparator(index, order)));
            });
            return table;
      }


    </script>
  </body>

</html>
Ответить с цитированием