如何使用文本输入去锚？

我想使用jQuery通过使用文本框转到锚点，例如，我想使用此表单：

在这个表单中，我将键入锚点的名称，当我单击“转到锚点”按钮或按回车键时，我希望页面向下滚动到该锚点：

 Target 

如何使用jQuery？

Answer 1

  var anchor = $("#gotoanchorinput").val(); var position = $("#"+anchor).offset(); window.scrollTo(position.left, position.top); 

这段代码使您的页面滚动到#gotoanchorinput写的#gotoanchorinput 。

Answer 2

尝试这样的事情：

 $(function() { $('form#gotoanchorform').submit(function(e) { e.preventDefault(); var desired = $('#gotoanchorinput').val(); window.location.href = window.location.href + '#' + desired; // or $('html, body').animate({'scrollTop', $('a[name*="' + desired +'"').offset().top + 'px'}, 900); return false; }); }); 

因此，如果您键入“foo”并单击“提交”，页面将滚动到哪个名称属性包含“foo”

Answer 3

HTML部分：

注意：data-x属性是有效的HTML。

JS部分：

 $(document).ready(function() { $('#myForm').submit(function(e){ $(location).attr('href', $(this).attr('data-anchor')); return false; }); }); 

Answer 4

简单地说：

 var url = $('#gotoanchorinput').val(); $(location).attr('href',url);