[英]Is it possible to type numbers to navigate between pages with Javascript?
I am trying to find out whether it is possible using javascript or jQuery to navigate a Wordpress site using your numerical keypad. 我试图找出是否有可能使用javascript或jQuery使用数字小键盘浏览Wordpress网站。
For a Flash example, see here: http://elevenfilm.com/ - type in one of the 3 digit numbers to go to that page. 有关Flash的示例,请参见此处: http : //elevenfilm.com/-输入3位数字之一以转到该页面。
Can anyone help? 有人可以帮忙吗? Thanks.
谢谢。
Here is an simple example 这是一个简单的例子
HTML 的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 JS
$('input').keyup(function() {
$('.page').hide();
$('.page'+$(this).val()).show();
});
Fiddle: http://jsfiddle.net/5G8m9/ 小提琴: http : //jsfiddle.net/5G8m9/
Edit 编辑
An ajax call might look like this, depending on your dom structure. 根据您的dom结构,ajax调用可能看起来像这样。 You can set a hashtag to show the page in the url there as well.
您还可以设置一个主题标签以在该页面的url中显示该页面。
$('input').keyup(function () {
$.ajax({
url: "http://yourblog.com/page/"+$(this).val()
}).done(function (data) {
location.hash = $(this).val();
$('.content').html(data);
});
});
Read about it here: http://api.jquery.com/jQuery.ajax/ 在此处阅读有关内容: http : //api.jquery.com/jQuery.ajax/
Sven's edit would work, however a simpler (AJAX free) approach would be: 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
});
This will simply redirect the browser to www.domain.com/?pageId=<NumberPressed>
. 这将只是将浏览器重定向到
www.domain.com/?pageId=<NumberPressed>
。 Without more information, it is difficult to improve this answer. 没有更多信息,很难改善此答案。
This is an extension to @DerFlatulator's answer that allows you to enter a 3 digit number before navigating to the page 这是@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("");
}
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.