jquery 滚动到特定的 div 位置以防出现错误和焦点

标签 jquery validation scroll position

我的表单中有一个隐藏的 div,其中包含特定的错误消息。在提交表单之前,我运行验证例程来检查所有必填字段是否都填充了某些文本。如果没有,带有“redAlert”类的 div 将在文本字段的正上方可见。我还希望在显示错误消息时对话框窗口向右滚动到该位置。我知道有很多插件可用于执行此操作,但我想使用简单的 Jquery 来执行此操作。我试图A)找到第一个可见的div与类redAlert,b)通过调用该div上的.offset()来找到它的位置,然后c)在窗口对象上调用.scroll()但我没有得到这个上类。如果我完全遗漏了一些东西或者我的语法无效(我经常发现自己在使用 Jquery 时遇到语法错误),请告诉我。下面是我的代码。 另外 - 这只能找到可见的 div(假设一次只有一个错误 div),您能否为我提供用于查找具有特定类的第一个可见 div 的选择器。

var errorDiv = $('.redAlert:visible').attr("id");
var scrollPos = $("#"+errorDiv ).offset();
//alert(scrollPosition); // This alert always says 'null', why ?
$(window).scroll(scrollPos);
//Also tried scrollTo();

提前非常感谢。

最佳答案

var errorDiv = $('.redAlert:visible').first();
var scrollPos = errorDiv.offset().top;
$(window).scrollTop(scrollPos);

演示: http://jsfiddle.net/Cjuve/2/

关于jquery 滚动到特定的 div 位置以防出现错误和焦点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8885558/

相关文章:

javascript - jQuery - 如何检查是否在特定 DIV 中单击了任何链接?

javascript - 获取从日期开始多少天/小时/秒

jquery - 在 Razor 中使用 JQuery 变量

jquery - HTML 顶部栏已修复并在滚动时重新调用

javascript - 当滚动条出现时播放 YouTube 视频

javascript - 在 iPhone 面板的幻灯片中启用内容滚动

javascript - JQuery 在 5,10,15...55 整点后每 5 分钟运行一次

java - 密码验证 8 位数字,包含大写、小写和一个特殊字符

vue.js - 使用 Quasar (Vue) 进行服务器端输入验证

ruby-on-rails - 自定义验证器以防止 Rails 4 应用程序中的重叠约会?