使用jQuery将高度设置为iframe后的滚动问题答案

【问题标题】：Scroll Issue after setting height to iframe using jQuery使用jQuery将高度设置为iframe后的滚动问题
【发布时间】：2015-03-14 20:51:39
【问题描述】：

我正在使用jquery 将高度动态设置为iframe。它工作正常，但问题是如果用户clicks 在链接上查看更多低于DataList 的数据，那么它将高度完美地设置为iframe，但它会滚动到顶部。我想将Scroll position 保持在Click 上LinkButton 的位置。我正在使用 c# LinkButton 但在这里没关系。整个页面在iFrame 内，所以我只是根据document 高度设置iframe 高度。所以根据代码在pageLoad() 的jquery 上调用function。

我的代码：

        function adjustHeight() {
            var iframe = jquery(window.top.document).find("#frameContent");
            iframe.height(0 +'px');

            var height = jquery(document).height() + 30;

            iframe.height(height +'px');
        }

        function pageLoad() {
            adjustHeight();
        }

怎么做？一切都在c#。 DataList 和 LinkButton 在 UpdatePanel 里面，我只是使用 jquery 设置高度。

HTML 代码：DataList HTML with View More

【问题讨论】：

也许你在别的地方有一段代码比如.scrollTop()？
哪个数据列表？哪个链接按钮？根本没有足够的上下文，做一个jsfiddle。
@Brewal，没有。我没有在任何地方使用.scrollTop()。
我在下面的回答是假设您有一个 # 链接或导致您的页面跳转（或 iframe 内的页面）的东西。小提琴会有很大帮助。
@DeeMac，请查看我更新的帖子。

标签： jquery html css asp.net iframe

【解决方案1】：

经过多次尝试，我得到了解决方案。

这只是因为我在设置新高度之前将高度 0 设置为框架而导致问题。
简单地说，我删除了下面的行并且它起作用了。 :)

iframe.height(0 +'px');

【讨论】：

【解决方案2】：

据我所知，我假设用户单击的链接是锚链接或 # 链接，对吗？这将导致页面跳转到顶部。你可以做的是在你的点击函数/事件中返回 false：

例子：

$("a.someLink").bind("click", function(e){ // Your logic here... // The below prevents the native behavior of the link occurring... e.preventDefault(); e.returnValue = false; return false; })

更新

尝试从您的按钮（链接）中删除内联 javascript 函数，而是使用 jQuery 实现它，添加 return false 等。所以您的按钮代码现在看起来像这样：

<a href="#" class="viewmore" id="lnkbtnViewMore">View More</a>

而 jQuery 是这样的：

$("#lnkbtnViewMore").bind("click", function(e){ __doPostBack('lnkbtnViewMore',''); e.preventDefault(); e.returnValue = false; return false; })

这应该可以解决问题...

【讨论】：

我不知道为什么这是 dv
为什么投反对票？？它在 OP 的问题中明确说明“...点击链接...”
我没有使用任何inline javascript。 LinkButton 使用 code behind ClickEvent 获取更多数据。
是的，您使用的是内联 JavaScript。这个 javascript 就在这里，与您的 <a> 元素“内联”：<a href="javascript:__doPostBack('lnkbtnViewMore','')"...
您尝试过我上面的建议了吗？如果我在小提琴中查看您的代码，我认为它没有理由不起作用。没有外部 URL 且不阻止默认行为的链接的默认行为是将页面（窗口）发送回顶部。因此，将函数移动到 jQuery 绑定事件函数中并返回 false 应该可以解决问题。