Javascript jQuery从id获取总位置
我想在Ajax重新加载容器中的内容后,在变量#id上设置焦点位置。容器本身有Javascript jQuery从id获取总位置,javascript,jquery,css,scroll,Javascript,Jquery,Css,Scroll,我想在Ajax重新加载容器中的内容后,在变量#id上设置焦点位置。容器本身有溢出:auto
溢出:auto如果内容太大,我会看到一个滚动条。但在插入新内容后,我无法将焦点集中在我要设置的#id上
我首先尝试将焦点设置在ID上:
<script type="text/javascript">
function SetFocus(ulID) {
var HeightUL = $("#"+ulID).offset();
$("#"+ulID).focus();
}
</script>
但这也不起作用。使用position()
返回0,使用offset()
只返回对象相对于其父对象的高度。而不是对象位于其容器内的总高度
HTML:
<div class="info-container edit" id="info-container-edit">
<span class="cat">Info 1</span>
<ul id="Info1" class="cat-list music">
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<span class="cat cat">Info 2</span>
<ul id="Info2" class="cat-list music">
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<span class="cat cat">Info 3</span>
<ul id="Info3" class="cat-list music">
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
<span class="cat cat">Info 4</span>
<ul id="Info4" class="cat-list music">
<li>...</li>
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
</div>
信息1
信息2
信息3
信息4
Ajax代码刷新容器#info container edit
。例如,我的问题是我想用SetFocus('Info3')关注#Info3
代码>。它似乎返回了#Info2
的高度,而不是从容器#info container edit
到#Info3
的总高度
有人能指出如何解决这个问题吗?如果我能得到一个#id在其容器中的位置高度,我应该能解决这个问题。或者如何在#id上设置显示焦点?试试这个
$(document).ready(function(){
$(window).scrollTop($('#Info2').offset().top);
});
看到它在工作您可以使用:
Ajax成功后,您在哪里调用SetFocus()
。我确实知道,为了获得高度,我应该在ajax处理之前首先存储高度位置,当我获得ajax成功时,我会将此高度用于scrollTop。但首先我需要获得正确的高度。同样不起作用,我得到了错误:TypeError:document.getElementById(…)为null我想这是因为我用Ajax重建了整个信息容器编辑内容,所以在构建之后元素ID消失了。@Flyhnl好的,那么你想滚动到视图中的元素是什么?现在可以工作了!我注意到,当我在它前面放置一个警报时,它确实滚动到了正确的元素。只是为了测试我是否有正确的元素名。在那之后,我在成功状态上看得更好了,做了一个更好的触发器。@Flyhnl太棒了!很乐意帮忙:)
$(document).ready(function(){
$(window).scrollTop($('#Info2').offset().top);
});
document.getElementById(ulID).scrollIntoView(false);