【问题标题】:Javascript increment a variable in a functionJavascript在函数中增加一个变量
【发布时间】:2021-07-08 00:31:22
【问题描述】:

大家好,我是编程新手,我需要为学校制作一个网站。 我想在按箭头键时打开下一页。所以我想, 当按下按钮时,我可以将 URL 放入一个数组中以增加索引。 不幸的是,当我按下向下键时,我得到了一些从 1 到 3 的随机数。

const url = ['/#t1', '/#t2', '/#t3', './contact.html', './404.html'];

var index = 0;

$(document).keydown(function(e) {
    switch(e.which) {
       case 38: // up
           up();
       break;

       case 40: // down
           down();
       break;

       default: return; 
   }
   e.preventDefault();
});

function up() {
    index = index - 1;
    alert(index);
    window.location.href = url[index];
}

function down() {
    index = index + 1;
    alert(index);
    window.location.href = url[index];
}

【问题讨论】:

  • 需要意识到,当您切换到新页面时,当前代码已经消失,新页面会加载一个全新的实例。因此,每次加载相同的代码时,索引都会设置为零
  • 您可以使用sessionStorage在页面之间保存数据。
  • 我同意 charliefl 的观点,听起来它正在重新加载。此外,我会将您的阻止默认值移至函数的第一行。
  • location.hash = url[index] 用于散列。
  • 好吧,这是有道理的,你知道如何防止这种情况吗?一切都在 app.js 文件中。

标签: javascript arrays function switch-statement increment


【解决方案1】:

在不使用存储的情况下解决此问题的一种快速方法是在数组中查找索引,而不是跟踪它。你可以这样做:

const url = ['/list', '/of', '/urls'];

//find index of current url in array
let index = url.indexOf(window.location.pathname)

if(index == -1){
 //url is not in the array
 windows.alert("invalid url")
}

编辑:我同意 Michael Geary 的观点,这对于现实世界的网站来说是个坏主意

【讨论】:

    【解决方案2】:

    不要这样做!

    您正在做的是一个有趣的练习,但它破坏了您网站的任何访问者可能期望的正常页面滚动。

    当我查看网页时,我使用向上和向下箭头键滚动浏览它。例如,打开Stack Overflow 主页或Hacker News 并按几次向下箭头,然后按向上箭头。滚动是网页的工作方式。

    有一些例外。 Google 主页打开,文本光标位于主输入字段中,向下箭头打开最近搜索的列表。这是完全合理的。

    但是让向下箭头跳转到页面的一个全新部分 - 或者完全是另一个页面! - 不是游客所期望的。除非你有充分的理由,否则不要这样做。

    如果你有充分的理由,我会很想知道的! :-)

    【讨论】:

    • 你说得对,这不是设计网站的好方法。我只是玩得开心,尝试不同的事情。我永远不会将它用于现实世界的应用程序,我保证:)。编辑:我还需要提到这些网站上没有启用滚动。
    • 这是给学校的。完全易碎!
    • 哇!你把我吓到了。但是,是的,作为一个有趣的学习练习,这非常酷。在那种情况下,@CWB 发布的解决方案非常好。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-08-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-19
    相关资源
    最近更新 更多