繁体   English   中英

箭头键用jquery导航到照片页面

[英]Arrow keys navigation to photo pages with jquery

我正在尝试向右和向左添加箭头键以导航到照片页面。 每个照片页面都有如下所示的导航部分。 一旦我按下该键,它就会转到无法停止的操作转发到下一页。 任何人都可以帮助我。 提前致谢。

<div style="margin: 10px auto 0 auto; text-align: center; width: 650px;">
<div class="nav_section" id="navigation">

<ul>

<li> <a href="/photos/view/120"><img src="/photos/square/120-df1dppn7253nge2e929k.jpg"></a> </li>

<li> <a href="/photos/view/118"><img src="/photos/square/118-dmfpm8xtzdg3kb2k85b8.jpg"></a> </li>

<li> <a href="/photos/view/116"><img src="/photos/square/116-kfaga5w36gbhej7g641c.jpg"></a> </li>

... and so on,.... 

</ul>

</div>
</div>

这是我得到的垃圾脚本:

<script type="text/javascript">
$(document).ready(function() {
    $(document).keyup(function(event) {
        var key = event.which;
        if(key == 37) { // Left arrow key
$('a').trigger('click');
}
if(key == 39) { //Right arrow key
        $('a').trigger('click');
}
});
});
</script>

看起来你正在点击页面$('a')上的每个锚点。 您可能需要在那里更改选择器。

如果没有更多的上下文,我无法指导你做什么 - 但你需要弄清楚活动画面,我假设触发点击它(或一些导航元素),这取决于你的东西是如何工作的。

谢谢你们,...问题解决了,...我只是在照片链接prevP和nextP上添加了一个类

如果有人需要,这是正确的脚本:

<script type="text/javascript">
$(document).ready(function() {
    $(document).keyup(function(event) {
        var key = event.which;
        if(key == 37) { // Left arrow key
            $('a.prevP').trigger('click');
        }
        if(key == 39) { //Right arrow key
            $('a.nextP').trigger('click');
        }
    });
});
</script>   

您的点击事件一定会出现问题。 让函数负责执行任何操作(后退/前进),然后在需要时调用它可能是一个好主意。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM