iOS 6中从横向到纵向的文本输入的占位符属性 [英] Placeholder attribute on text input with iOS 6 from landscape to portrait
问题描述
我在更新到iOS 6后遇到问题，这让我感到疯狂。
I have a problem after updating to iOS 6 that is driving me nuts.
看起来我在输入字段上有placeholder属性的时候，当从
纵向旋转到风景并再次回到肖像时，页面左移一些像素，导致水平条。
It looks like any time I have the attribute "placeholder" on an input field, while rotating from Portrait to Landscape and back to Portrait again the page shifts some pixels on the left side causing a horizontal bar.
经过长时间的研究，我得出结论它必须是与元视口相关的东西，因为每次我使用content =width = device-width都可以正常工作。
I concluded after long research that it has to be something related to the meta viewport because every time I use the content="width=device-width" all works fine.
PS是的我真的需要在输入上具有百分比宽度以便具有液体设计：）
P.S Yes I really need to have a percent width on the input so as to have liquid design:)
以下是重新创建问题的示例。谢谢......
Here is the example to recreate the issue. Thanks...
<html>
<head>
<title>test</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport"/>
</head>
<body>
<div style="width:100%;background-color:red">
<input id="testInput" placeholder="test" style="width:90%;" />
</div>
</body>
</html>
推荐答案
我发现了这个问题。
并修复它。
I found this problem. and fix it.
（网址： http ：//mooki83.tistory.com/2656550 （在韩国））
testURL： http://mooki83.da.to/m/testios6.html
javascript：
javascript :
/* Optimized PLACEHOLDER for iOS6 - Mooki ( http://mooki83.tistory.com ) */
$(document).ready(function(){
$(window).bind("orientationchange.fm_optimizeInput", fm_optimizeInput);
});
function fm_optimizeInput(){
$("input[placeholder],textarea[placeholder]").each(function(){
var tmpText = $(this).attr("placeholder");
if ( tmpText != "" ) {
$(this).attr("placeholder", "").attr("placeholder", tmpText);
}
})
}
这篇关于iOS 6中从横向到纵向的文本输入的占位符属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
