是否可以使用Javascript在页面之间键入数字进行导航?

Is it possible to type numbers to navigate between pages with Javascript?

本文关键字：数字 导航 之间 可以使 Javascript 是否      更新时间：2023-09-26

我想知道是否可以使用javascript或jQuery使用数字键盘浏览Wordpress网站。

关于Flash的例子，请看这里:http://elevenfilm.com/-输入其中一个3位数的数字来进入那个页面。

有人能帮忙吗?谢谢。

下面是一个简单的例子

HTML 

<input type="text" />
<div class="page page120">You're on page 120</div>
<div class="page page240">You're on page 240</div>
<div class="page page360">You're on page 360</div>

JS 

$('input').keyup(function() {
   $('.page').hide();
   $('.page'+$(this).val()).show(); 
});

小提琴:http://jsfiddle.net/5G8m9/

编辑

一个ajax调用可能看起来像这样，这取决于你的dom结构。你也可以在url中设置一个标签来显示页面。 
$('input').keyup(function () {
    $.ajax({
        url: "http://yourblog.com/page/"+$(this).val()
    }).done(function (data) {
        location.hash = $(this).val();
        $('.content').html(data);
    });
});

阅读这里:http://api.jquery.com/jQuery.ajax/

这是@DerFlatulator的答案的扩展，允许您在导航到页面之前输入3位数字

// keys and loc should be outside the scope of your event handler
// a list of valid keys and their values (0-9 and 0-9 on numberpad)
var keys = { "48": 0, "49": 1, "50": 2, "51": 3, "52": 4, "53": 5, "54": 6, "55": 7, "56": 8, "57": 9, "96": 0, "97": 1, "98": 2, "99": 3, "100": 4, "101": 5, "102": 6, "103": 7, "104": 8, "105": 9 };
// used to hold the page being typed
var loc = []; 
$(document).keyup(function(e) {
    if (keys[e.keyCode]) {
        if (keys.push(keys[e.keyCode]) == 3) {
            document.location.href = "/?pageId=" & loc.join("");
        }
    }
});

Sven的编辑可以工作，但是更简单的(无AJAX)方法是:

$(document).keyup(function (e) {
    var charCode = (96 <= e.which && e.which <= 105) 
        ? e.which - 48 
        : e.which;
    var keyVal = String.fromCharCode(charCode);
    if (!isNaN(parseInt(keyVal)))
        window.location.href = '/?pageId=' + keyVal
});

这将简单地将浏览器重定向到www.domain.com/?pageId=<NumberPressed>。如果没有更多的信息，很难改进这个答案。

编辑:这是一个基本的JSFiddle

相关文章：