js计算总页数

假设你已经知道了总记录数 `total` 和每页显示的记录数 `pageSize`，那么可以通过以下代码计算总页数：

function getTotalPages(total, pageSize) {
  return Math.ceil(total / pageSize);
}

其中，`Math.ceil()` 函数用于向上取整，确保总页数是整数。比如，如果总记录数为 10，每页显示 3 条记录，则总页数为 4。如果总记录数为 9，每页显示 3 条记录，则总页数也是 3。

调用该函数，可以这样写：

const total = 100; // 假设总记录数为 100
const pageSize = 10; // 假设每页显示 10 条记录
const totalPages = getTotalPages(total, pageSize); // 计算总页数
console.log(totalPages); // 输出结果为 10

相关问题

vue 怎么统计要打印的总页数

在Vue中，要统计要打印的总页数，可以通过以下步骤来实现：

1. 首先，需要在Vue组件的数据中定义一个变量来保存总页数，比如将其命名为`totalPages`，并初始化为0。

2. 在页面渲染完成之后，我们可以通过Vue的生命周期钩子函数`mounted()`来执行一段代码来计算总页数。

3. 在计算总页数的代码中，需要获取打印内容的高度以及页面的高度。可以通过`document.getElementById()`等方法获取到打印内容的元素，并使用`offsetHeight`属性获取到其高度。

4. 接下来，需要获取页面的高度。可以通过`window.innerHeight`来获取窗口的高度。如果要打印时自定义页面高度，可以设置一个变量来保存自定义高度。

5. 将打印内容的高度除以页面的高度，得到的结果就是总页数。可以使用`Math.ceil()`来向上取整，确保页数向上取整。

6. 最后，将计算得到的总页数赋值给之前定义的变量`totalPages`，以便在页面中使用。

示例代码如下：

<template>
  <div>
    <!-- 打印内容的DOM元素 -->
    <div id="printContent">
      <!-- 内容 -->
    </div>
    <!-- 需要打印时触发的按钮 -->
    <button @click="printDoc">打印</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      totalPages: 0 // 总页数
    };
  },
  mounted() {
    // 在页面渲染完成后计算总页数
    this.calculateTotalPages();
  },
  methods: {
    calculateTotalPages() {
      const printContent = document.getElementById("printContent");
      const contentHeight = printContent.offsetHeight;
      const pageHeight = window.innerHeight;
      this.totalPages = Math.ceil(contentHeight / pageHeight);
    },
    printDoc() {
      // 执行打印操作
    }
  }
};
</script>

通过以上步骤，我们可以在Vue中实现统计要打印的总页数，并将其应用到页面中。

编写代码：设置每页显示div的个数，并显示当前页数、总页数和总个数

好的，下面是一个简单的示例代码：

HTML：

<div id="container"></div>
<div id="pagination"></div>

JavaScript：

// 假设有20个div
const total = 20;
// 每页显示5个
const perPage = 5;
// 总页数
const totalPages = Math.ceil(total / perPage);
// 当前页数
let currentPage = 1;

// 获取容器和分页的DOM元素
const container = document.getElementById('container');
const pagination = document.getElementById('pagination');

// 显示当前页的div
function showDivs() {
  // 计算当前页的div的起始和结束索引
  const startIndex = (currentPage - 1) * perPage;
  const endIndex = Math.min(startIndex + perPage, total);
  // 清空容器
  container.innerHTML = '';
  // 添加当前页的div
  for (let i = startIndex; i < endIndex; i++) {
    const div = document.createElement('div');
    div.innerText = `这是第${i + 1}个div`;
    container.appendChild(div);
  }
}

// 显示分页信息
function showPagination() {
  // 计算总个数
  const totalCount = `${total}个div`;
  // 显示当前页数、总页数和总个数
  const pageInfo = `当前第${currentPage}页，共${totalPages}页，${totalCount}`;
  pagination.innerText = pageInfo;
}

// 初始化页面
showDivs();
showPagination();

// 绑定分页按钮的点击事件
pagination.addEventListener('click', (event) => {
  const target = event.target;
  if (target.tagName === 'BUTTON') {
    // 获取按钮的页码
    const page = Number(target.innerText);
    if (page === currentPage) {
      // 如果点击的是当前页，直接返回
      return;
    } else {
      // 否则更新当前页码并重新渲染页面
      currentPage = page;
      showDivs();
      showPagination();
    }
  }
});

// 添加分页按钮
for (let i = 1; i <= totalPages; i++) {
  const button = document.createElement('button');
  button.innerText = i;
  pagination.appendChild(button);
}

这段代码会在页面上显示20个div，每页显示5个，同时显示当前页数、总页数和总个数。你可以点击分页按钮来切换当前页。