Javascript 单击“下一页”会使我的页面速度呈指数级下降

这是我第一次问有关堆栈溢出的问题，如有任何帮助，将不胜感激

我有一个显示pixabay api图像的网站。单击“下一步”按钮时，将显示下一页图像。问题是，每次单击，页面都会以指数级速度减慢。我知道这一点，因为我在每次完成后都添加了一个success console.log

这是之前的图像：

之后

我认为这个问题与.getJSON调用和该调用中的for循环有关，但我一直没有弄清楚

这是Javascript和HTML

/*
Pixabay api密钥：
*/
$（文档）.ready（函数（）{
var searchValue=“大米”
var defaultPage=1；
返回照片（searchValue，默认页面）；
$（“#搜索表单”）。关于（“提交”，函数（事件）{
//从用户输入中获取值
searchValue=$（“#searchText”）.val（）；
返回照片（searchValue，默认页面）；
//阻止表单提交到文件
event.preventDefault（）；
});
});
/*
1.从pixabey API返回照片
*/
函数returnPhotos（searchValue，pageNum）{
let key=“8712269-5B0EE0617CEEB0FD2F8447C3”；
让startURL=”https://pixabay.com/api/?key=“+键；
让page=“&page=“+pageNum；
让imagesPerPage=“&per_page=“+22
let addWH=“&minu-width&minu-height”；
让safeSearch=“&safeSearch=true”；
让endingURL=“&q=“+searchValue+page+addWH+safeSearch+imagesPerPage；
//激活api并获取数据
$.getJSON（startURL+endingURL，函数（数据）{
让image=data.hits；
var imageLength=image.length；
arrayLength=image.length；
如果（数据）{
let output=“”
for（设x=0；x







Rexford Koduah版权所有©；2018。保留所有权利

每次调用

getPage

，您都在添加另一个

$（“#分页2”）。单击

处理程序。这意味着您第一次单击它时，会执行一个ajax请求。第二次执行两个，第三次执行三个，以此类推。您需要只设置一次单击处理程序，并确保您的逻辑反映了这一点，或者每次使用

$（“#分页2”）。关闭（'click'）。单击（

谢谢你的重放，你说过我可以用：$（“#pagination2”）.off（'click'）.click（）？我问这个问题是因为我不确定如何设置一次单击处理程序，同时，每次单击按钮时都让页面重新加载新图像。对，只需添加

.off（'click'））

就在

之前。单击它工作了！我使用了$（“#pagination2”）。关闭（'click'）。单击（function（））方法，现在我没有问题了！非常感谢dave！你太棒了！太棒了！如果成功了，你应该接受答案我知道我不是唯一一个有这个问题的人，希望这个答案能帮助其他有同样问题的人