我对这个仅限移动设备的问题有些困惑，我也可以在Google Chrome浏览器（即使在开发人员工具设置为移动视图的情况下，也可以在台式机上复制）。
问题很简单。我在网站上有一个基本表单，其中包含一个文本区域和一个提交按钮。当我点击文本区域时，它将获得焦点，然后在其中键入任何内容，移动浏览器将更改文本区域的高度，并覆盖了我的“提交”按钮，用户无法再使用它。这里的问题是，chrome扩大了文本字段的高度以使文本变大，但没有中继整个网站，因此它仅覆盖了按钮。如果我在文本字段中保留任何文本，即使失去焦点，它也会保持放大状态。我不确定这是错误还是功能，但对我来说似乎并不聪明。
似乎chrome在看到任何文本输入后立即放大了textarea的字体，并且由于高度是根据行数计算的，因此它会更改并反映出来，但是由于某种原因，它没有影响页面的其他部分。
[我知道使用viewport标签将解决此问题，并计划在将来使网站对移动设备友好，但这将需要大量工作，因此我不能立即使用它。
设置高度（例如，高度：50像素；）也可以解决此问题，但是我确实需要在网站的某些部分中根据行数来定义它。
扩大文本区域并不是一个大问题，任何可以使站点正常运行的方法现在都可以解决。如果有人对此主题有更多了解，我也将对此问题的根本原因感兴趣。
我无法在codepen.io上重现此内容，因为他们正在使用视口标签，所以我准备了一个简单的示例，如下所示：
<html> <head> <style> textarea { width: 990px; background: red; } input { background: blue; } </style> </head> <body> <textarea name="test" cols="40" rows="5"></textarea><br /> <input type="submit" name="Button" value="Button" /> </body> </html>经过一番尝试，我设法找到了一种使用JS解决该问题的方法，但确保有更好的解决方案：
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script> <script type="text/javascript"> $(document).ready(function() { var textarea = $('textarea'); var originalRows = parseInt(textarea.attr('rows')); textarea.on('input', function() { textarea.attr('rows', originalRows+1); textarea.attr('rows', originalRows); }); }); </script>谢谢你们的时间，任何帮助将不胜感激！
我对这个仅限移动设备的问题有些困惑，我也可以在Google Chrome浏览器上重现（即使在开发人员工具设置为移动设备视图的情况下，也可以在台式机上复制）。问题很简单。我有一个基本形式...
我没有找到合适的解决方案，因为它似乎确实是chrome本身的错误。但是我发现了我将要使用的一种非常不错的非侵入性解决方法。