在Chrome上使用Tab键时，iFrame不会滚动 [英] iFrame doesn't scroll when using tab key on Chrome
问题描述
我有一个嵌入iFrame的网络应用程序。对于我们的HTML页面中的一个，我们有很多文本框，内容相当大，所以必须向下滚动才能浏览内容。当我们使用Tab键在文本框中导航时，如果文本框存在于页面中间的某处，则iFrame不会滚动，这可以通过鼠标滚动来看到。请注意，文本框的重点在那里。
这个问题只发生chrome，它工作正常在Firefox和IE11。
在chrome部分有一个线程在code.google.com有提到这个问题，但仍然没有找到解决方案。 问题链接
复制问题的示例代码在这里示例代码
I have a web application which is embedded inside an iFrame. For one of our HTML page we have lots of textboxes, and the content is quite big, so that one has to scroll down to navigate through the content. When we navigate through the textboxes by using the tab key, the iFrame doesn't scroll if the textbox is present somewhere in the middle of the page, which can be seen through scrolling via mouse. Please note that, the focus on textbox is there. This issue is only occurring chrome, it works fine in Firefox and IE11. There is one thread on code.google.com in chromium section where there is mentioned of this issue, but still no solution has been found. Issue Link The sample code to replicate the issue is here Sample Code
推荐答案
这个问题在Chrome的最新版本，即43.0和更高版本中修复。无论如何，尝试下面的jquery。
This issues gets fixed in the lastest version of Chrome ie 43.0 and higher. In anycase try the below jquery.
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('input').focus(function() {
$('html, body').animate({
scrollTop: $(this).offset().top - 50
}, 20);
});
});
</script>
</head>
这篇关于在Chrome上使用Tab键时，iFrame不会滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
