javascript - Jquery左右导航不起作用

标签 javascript jquery html function

我有以下简单的 html 页面:

<html>
<head>
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).keydown(function(e){
    if (e.keyCode == 37) {  // left
       $('#prev').click();   
       return false;
    } else if (e.keyCode == 39) {  // right
       $('#next').click();
       return false;
    }
});
</script>
</head>

<body>
<a id="next" href="/next">next</a>
<a id="prev" href="/prev">prev</a>
</body>

</html>

我想让用户使用左右键盘键导航文章。因此,单击向左箭头应转到/prev 链接,单击向右箭头应转到/next 链接。由于某种我无法理解的原因,它无法在任何浏览器中运行。

谢谢

最佳答案

像这样:

$(document).keydown(function(e){    
    if (e.keyCode == 37) {  // left
       window.location.href = $('#prev').attr('href');   
       return false;
    } else if (e.keyCode == 39) {  // right
       window.location.href =  $('#next').attr('href');  
       return false;
    }
});

您正在元素上调用 .click(),但这不会触发 click 事件,那就是 .trigger() 用于:

$(document).keydown(function(e){
    if (e.keyCode == 37) {  // left
       $('#prev').trigger('click');   
       return false;
    } else if (e.keyCode == 39) {  // right
       $('#next').trigger('click');
       return false;
    }
});

关于javascript - Jquery左右导航不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15686893/

相关文章:

jquery - 如何不断检查 <div> 中新的 <li> 元素?

HTML 的 JavaScript 日期验证

java - 将 Html.fromHtml 与 android 8 十六进制数字颜色资源一起使用

html - 如何将 div 与另一个 div 中的图像居中?

javascript - 刻度线在线性时间刻度中不可见

javascript - 删除或更新一系列单元格时,谷歌表格时间戳脚本不更新

javascript - jQuery - 暂时禁用功能然后再次启用它

javascript - TSLint 合并导入

javascript - 使用 jQuery 将无限文本输入 DatePickers 添加到 DOM 加载后添加的字段?

javascript - 显示一组 <li>,然后隐藏它们以显示另一组 <li>