Javascript jQuery分页转到输入值更改页面

Javascript jQuery分页转到输入值更改页面,javascript,jquery,input,pagination,Javascript,Jquery,Input,Pagination,我正在为我的网站创建一些分页,并希望使用输入元素在页面之间导航 如以下示例所示: 输入需要点击“return”键才能触发脚本 如果输入的值不在范围内,将触发警报。e、 g.如果有32页,“请输入一个介于1和32之间的值” 通过检测页面范围内的值变化并重定向到该页面,可以使用jQuery或javascript实现这一点吗 我正在尝试在Getty Images上创建相同的设备: 要通过“return”键运行页面更改脚本,您应该使用$('input')。在('keypress')事件上,检查事件。哪

我正在为我的网站创建一些分页,并希望使用输入元素在页面之间导航

如以下示例所示:

输入需要点击“return”键才能触发脚本

如果输入的值不在范围内,将触发警报。e、 g.如果有32页,“请输入一个介于1和32之间的值”

通过检测页面范围内的值变化并重定向到该页面,可以使用jQuery或javascript实现这一点吗

我正在尝试在Getty Images上创建相同的设备:


要通过“return”键运行页面更改脚本,您应该使用
$('input')。在('keypress')
事件上,检查
事件。哪个
属性(对于“return”应该是“13”)。

您可以使用get表单和html5来完成此操作,而不使用javascript:

<form class="pageNumberForm" type="GET">
    <input type="number" name="page" class="pageNumber" min="1" max="6" value="1" />
</form>​​​​​​​​​​​​​​​​​​​​​​​​​

​​​​​​​​​​​​​​​​​​​​​​​​​
如果您使用的是php,您可以填写max和current页面:

<form class="pageNumberForm" type="GET">
    <input type="number" name="page" class="pageNumber" min="1" max="[page maximum]" value="[current page]" />
</form>​
您可以添加jqueryvalidate来验证不支持html5的浏览器的表单

编辑1:

或者您可以添加此jquery代码来执行一些简单的验证,就像getty所做的那样:

$('.pageNumberForm').submit(function() {
    var pageInput = $(this).children('.pageNumber').first();
    var pageInputValue = pageInput.val();

    if (pageInputValue < pageInput.attr('min') || pageInputValue > pageInput.attr('max') || !pageInputValue.match(/\d+/)) {
        alert('Please enter a value between ' + pageInput.attr('min') + ' and ' + pageInput.attr('max'));
        return false;
    }
});​
$('.pageNumberForm').submit(函数(){
var pageInput=$(this).children('.pageNumber').first();
var pageInputValue=pageInput.val();
如果(pageInputValuepageInput.attr('max')||!pageInputValue.match(/\d+/)){
警报('请输入一个介于'+pageInput.attr('min')+'和'+pageInput.attr('max'))之间的值);
返回false;
}
});​

我的网站是ASP,我使用了以下代码,现在可以正常工作了

<form type="get" onchange="return false">
<input type="number" name="page" id="page" min="1" max="5" value="1" />


我将尝试为不支持HTML5的浏览器添加一些jQuery验证,但它在IE8中工作,所以我对此很满意。

您可以指定如何存储范围吗?页面范围使用以下方式存储:www.website.aspx?page=1