使用 href 中的参数调用 javascript 函数

Question

我正在做一个分页项目。我需要创建一个分页函数，它将传递页码并执行getData(page) 函数来获取页面数据并显示。但是，我的页码未定义。

<script>
$(document).ready(function() {
  var firstPage = "${firstPage}";
  var lastPage = "${lastPage}";
  var currentPage = "${currentPage}";
  var totalPage = "${totalPage}";
  setPagination(firstPage, lastPage, currentPage, totalPage);
});

function setPagination(firstPage, lastPage, currentPage, totalPage) {
  var paginationHTML = "";
  if (currentPage != 1) {
    paginationHTML = paginationHTML + '<a href="#" onclick="getData(1);>|&lt;</a>';
    paginationHTML = paginationHTML + '<a href="#" onclick="getData(parseInt(currentPage)-1);>&lt;</a>';
  }
  for (var i = parseInt(firstPage); i <= parseInt(lastPage); i++) {
    if (i == currentPage) {
      paginationHTML = paginationHTML + '<a href="#" onclick="getData(i); class="active">' + i + '</a>';
    } else {
      paginationHTML = paginationHTML + '<a href="#" onclick="getData(i);>' + i + '</a>';
    }
  }
  if (currentPage != lastPage) {
    paginationHTML = paginationHTML + '<a href="#" onclick="getData(parseInt(currentPage)+1);>&gt;</a>';
    paginationHTML = paginationHTML + '<a href="#" onclick="getData(totalPage);>&gt;|</a>';
  }

  $(".pagination").append(paginationHTML);
}

Answer 1

您不能像 getData(i) 那样将 i 作为字符串传递。当您从字符串动态调用函数时，您必须在参数中发送实际的 i。

而不是

paginationHTML = paginationHTML + '<a href="#" onclick="getData(i); class="active">' + i + '</a>';

写

  paginationHTML = paginationHTML + '<a href="#" onclick="getData('+i+'); class="active">' + i + '</a>';

其他地方也改一下，这样就可以在getData(i)

中得到i的值

Answer 2

onclick 属性中的变量在全局范围内求值，因此您不能在那里引用局部变量。

您可以在创建 HTML 字符串时扩展变量。模板文字使这更容易。

您还缺少所有 onclick 属性的结尾 "。

function setPagination(firstPage, lastPage, currentPage, totalPage) {
  var paginationHTML = "";
  if (currentPage != 1) {
    paginationHTML = paginationHTML + '<a href="#" onclick="getData(1);">|&lt;</a>';
    paginationHTML = paginationHTML + `<a href="#" onclick="getData(${currentPage}-1);">&lt;</a>`;
  }
  for (var i = parseInt(firstPage); i <= parseInt(lastPage); i++) {
    if (i == currentPage) {
      paginationHTML += `<a href="#" onclick="getData(${i});" class="active">${i}</a>`;
    } else {
      paginationHTML += `<a href="#" onclick="getData(${i});">${i}</a>`;
    }
  }
  if (currentPage != lastPage) {
    paginationHTML += `<a href="#" onclick="getData(${currentPage}+1);">&gt;</a>`;
    paginationHTML += `<a href="#" onclick="getData(${totalPage});">&gt;|</a>`;
  }

  $(".pagination").append(paginationHTML);
}

使用 href 中的参数调用 javascript 函数

calling javascript function with parameters in href

javascript

jquery

pagination