自定义输入字段以打开数字链接

如果可能，我想使用一个输入框，我可以输入“1”到“200”，并在应用时打开对应的链接。在同一站点和文件夹结构内的所有链接和输入。这比有限的分页更有利，而且更适合移动设备。自定义输入字段以打开数字链接

完整URL例如被打开是：http://example.com/test-1

目前，我有网页类似的结构，在结束“-1”到“-112”
允许以下部分预先确定：“http://example.com/test-”
因此，当输入字段中输入任意数字时，它将自己添加到上面列出的预定值中。只有“1”或任何其他号码输入该字段时。

希望与iOS和最流行的浏览器兼容。非常感谢您的帮助，因为我已经尝试了十几种其他导航方法，并且我觉得这将是最好的方法。我可以做输入的CSS和样式，但我正在寻找一个轻量级的方法来处理这个查询。

来源

2013-06-20 Kernel

使用下拉或使用JavaScript来创建花哨的形式验证并立即重定向 – ProfileTwist

此解决方案适用于我。顺便说一下，我喜欢基于键盘输入的界面，因为它们确实是最快的导航方式，但在这些日子里人们总是按下按钮并不普遍，所以我也在投票处理您的问题。

一些重要的功能和我编入代码的功能是，这种JavaScript浏览用户不需要在移动设备的键盘上按“Go”，同时还要确保用户有时间继续输入打算输入一个两位或三位数字。

<input type="text" onkeyup=" 
if (self.going) clearTimeout(self.going); 
var x = this.value.replace(/\D+/g, ''); 
if (!x) return; 
self.going = setTimeout(function() { 
    var url = 'http://example.com/test-' + x; 
/* alert(url); */ 
    location.href = url; 
}, 1000); 
" placeholder="Enter 1-112!" />

定制选项： 通过改变1000为不同的值，可以导航开始前（在过早离开用户完成输入前页风险）自定义稍有停顿。

来源

2013-06-20 00:33:22

正是我需要的，非常感谢！ – Kernel

@Kernel谢谢你！祝你网站好运！ –

这是非常简单明了：

<input type='text' placeholder='Enter a number' id='number' /> 
<input type='button' value='Go' id="go" /> 

<p>Please enter a number above.</p>

的jQuery/JS：

$('#go').on('click', function(event) { 
    var num = $('#number').val(); 
    if (num == "") return; 
    var url = "http://example.com/test-" + num; 
    window.location.href = url; 
});

例 http://codepen.io/hamstu/pen/shdjv

来源

2013-06-20 00:39:58 hamstu

自定义输入字段以打开数字链接

回答

相关问题