我有一个很长的表单，表单底部有提交按钮。我在用 required 属性标记的表单中有多个输入字段。因此，当前几个输入字段之一留空并且我向下滚动以单击提交时，错误“请填写此字段”正确出现在浏览器顶部的第一个错误中。但是，我必须一直向上滚动到顶部才能输入。如何让它自动向上滚动以关注第一个输入错误？
这是我的代码，它没有显示任何错误，但也不去href位置。当我更改href为“www.google.com”时，代码可以正常工作。为什么它不适用于同一页面链接？
<form>
<a href="#DivIdToScroll">
<div id="btnLink" onClick="generateReport();"> Generate </div>
</a>
</form>
<script>
function generateReport()
{
window.location.href = '#DivIdToScroll';
}
</script>
我必须使用$('html, body').animate(),使片段完全跨浏览器兼容,但这将动画链接,因为它们有时会采取行动时都不方便<html>和<body>.
IE8取决于拥有'html',而Chrome或Safari依赖于'body',所以我必须包括两者.
为什么会出现差异？
所以我有以下网站：http : //www.gameplay-universe.uphero.com/
您可以看到“跳至内容”链接。我想当它被点击页面滚动到div#content. 我正在使用最新版本的 jQuery。我怎样才能做到这一点？
是否有一些我可以执行的JavaScript代码滚动到Facebook上消息框的顶部？因此,当您单击"查看全部"并转到主消息页面时,如果向上滚动则会加载更多消息.我想强制它继续向上滚动以继续加载消息.我试过了
document.body.scrollTop = document.documentElement.scrollTop = 0;
但那当然只滚动到实际页面的顶部.有关如何滚动消息框的任何想法？
我一直在制作一个使用视差的网站，与它在http://keithclark.co.uk/articles/pure-css-parallax-websites/demo3/ 中的使用方式非常相似，我一直在尝试实现一些 jquery这将使页面在页面加载时自动滚动到底部。但是，我使用的命令根本不移动滚动条。我已经在静态网站上尝试过这个，它似乎工作正常。
$(document).ready(function() {
$("html, body").animate({
scrollTop: $(document).height()
}, 2000);
return false;
});
我的代码（去除文本）如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link href='https://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<style>
.email a {
color: #001F67;
text-decoration: none;
}
a {
text-decoration: none;
}
.title {
text-align: center;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: Black;
font-size: 6vmin;
}
.About {
text-align: center;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%); …可能重复:
jQuery滚动到元素
基本上,我希望我的用户能够立即向下滚动到特定的锚标记,就像使用标签一样.但是,我不能使用主题标签,因此想要使用javascript(最好是jquery)向下滚动它们.
有关如何做到这一点的任何想法？
我有一个id = now的div,这个div是空的,没有任何css属性(没有宽度,没有高度,只有一个隐藏的div).我想在浏览器完成加载页面时,然后立即滚动到此div.用户不需要点击某些东西.
这是我的HTML
<html>
<div>Long div Lorem ipsum</div>
<div id="now"></div>
<div>Long div Lorem ipsum</div>
如何用jquery做到这一点？
我的问题可能类似于,
和
$("#button").click(function() {
$('html, body').animate({
scrollTop: $("#elementtoScrollToID").offset().top
}, 2000);
});
我也尝试了这个:
this.element.find(".k-grid-content").animate({
scrollTop: this.select().offset().top });
}
但是,提供给上述问题的解决方案对我有帮助,我对第二个链接提供的小提琴链接有问题:http://jsfiddle.net/blackjim/9GCYE/5/
当我尝试获取行的表中某处的行的视图时,该解决方案正常工作.但是,在那之后,(即,在从网格底部获得一行的焦点之后),当我尝试从顶部选择一行时,控件仍然向下滚动,因此滚动功能的目的变得毫无意义那里.
我有一个搜索框,我可以在其中键入与行数据匹配的内容,如果匹配,则应触发滚动,以便将选定的行添加到用户视图中.
上述解决方案中的代码适用于此标准.但是,现在,再次,如果我尝试搜索与网格顶部的某些行匹配的内容,则滚动不会从底部(先前选定的行)发生到网格顶部的新选择的行.
我如何修改上面的代码以满足我的需要？
我的客户想要在特定页面上添加一个搜索框，允许他们的用户搜索产品并滚动到该文本。通过这种方式，她可以更轻松地将客户引导至页面的正确部分。
这可以使用带有浏览器搜索功能的 Ctrl-F 轻松完成。不幸的是，客户希望搜索成为网站的一部分。
关于如何实现这一点的任何建议？我一直在努力寻找 wordpress 插件，但我在互联网上使用的任何 JQuery 代码都失败了。
提前致谢！
我试图在ajax调用后滚动到页面上的某个元素,但由于某种原因它不起作用.我究竟做错了什么？
test.php的
<style>
#divOne {
border: 1px solid red;
height: 100%;
width: 100%;
}
#divTwo {
border: 1px solid blue;
height: 100%;
width: 100%;
}
</style>
<input id = 'click' type = 'submit' value = 'Click' onclick = "ajaxCall('testx.php')">
<div id = 'divOne'></div>
<div id = 'divTwo'></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type = "text/javascript">
function ajaxCall(action) {
$.ajax({
type: "POST",
url: action,
error: function(xhr,status,error){alert(error);},
success:function(data) {
document.getElementById('divTwo').innerHTML = data;
}, //end of success:function(data)
complete:function(data) {
$("#click").click(function (){
$('html, body').animate({
scrollTop: $("#divTwo").offset().top …我最近一直在写一个小博客，并希望可以从手风琴中访问连续的博客文章（下面的示例）。这样，您可以快速浏览帖子标题，选择一个有趣的并阅读。完成后，您可以无缝返回浏览，而无需进行不必要的菜单导航。
我的问题是，一旦你读完一篇文章并点击第二篇文章，我就无法让第二篇文章在顶部打开，标题可见。由于您已经向下滚动阅读了第一篇文章，因此您打开了第二篇文章的 2/3。这迫使用户一直滚动回到他尚未阅读的帖子的顶部。出于某种原因，我似乎什么都做不了；任何指导将不胜感激！
更新： 事实证明，由于我使用的是 jQuery 的精简版，因此我尝试使用的功能不可用。现在我已经克服了这个障碍，一切都可以编译，但我无法强制页面滚动到正确的位置。
我最接近的解决方案是这样，它会card-header在打开新部分时向上滚动到第一个（而我想要card-header点击的部分）。
$(".card-header").click(function (event) {
$('html, body').animate({
scrollTop: $(".card-header").offset().top
}, 300);
});
我正在尝试做的在逻辑上与此等效，但是这个确切的代码根本不滚动（它可以正确编译，并且替换$(this)为$(event.target)或$(event.target).parent()也不起作用）。
$(".card-header").click(function(event) {
$('html, body').animate({
scrollTop: $(this).offset().top-60
}, 300);
这是重现我的挣扎的最小工作示例：
$(".card-header").click(function (event) {
$('html, body').animate({
scrollTop: $(".card-header").offset().top
}, 300);
});
我希望实现单击锚标记的效果,并滚动到页面上的元素.
我已经用jquery scrollTo了.像这样:
$.scrollTo( this.hash, 1500, {
easing:'easeInOutCubic',
'axis':'y'
});
但是,我需要对齐它,以便元素在完成动画时位于视口的底部.页面上的每个部分都有不同的高度,因此我需要动态获取元素的位置和高度.
我很难弄清楚我需要计算什么数字来实现这个目标.
编辑
我现在把它改成了这个
var section = $(this.hash);
var scrollPos = $(section).offset().top + ( $(window).height() - $(section).height() );
$('html, body').scrollTop( scrollPos );
但这仍然是错误的,'#about'部分现在是点击页面的一半,而不是在视口底部对齐.
谢谢
javascript ×11
jquery ×11
html ×6
scroll ×4
css ×2
ajax ×1
bootstrap-4 ×1
facebook ×1
hashtag ×1
kendo-grid ×1
php ×1
plugins ×1
search ×1
selecteditem ×1
validation ×1
wordpress ×1