Jquery mobile 将iPhone上jQueryMobile中输入字段中的文本居中_Jquery Mobile

Jquery mobile 将iPhone上jQueryMobile中输入字段中的文本居中

jquery-mobile

Jquery mobile 将iPhone上jQueryMobile中输入字段中的文本居中,jquery-mobile,Jquery Mobile,因此，如果您看一下（为了保持一致性，我在下面发布了代码），您将看到输入文本居中。但是，如果我在iPhone（iOS5）上访问JSFIDLE（以及在我的测试站点上），则文本只是左对齐的。所以，我想知道你们可能知道这是一个已知的问题（谷歌-似乎不是），你们知道一个解决办法吗 css: js: html: 测试测试页免费注册！给我报名 text1 text2 等等…… 这里是JSFIDLE的一些修补：只是向您展示了一些尝试移动占位符的方法 HTML <!DOCTYPE html>

因此，如果您看一下（为了保持一致性，我在下面发布了代码），您将看到输入文本居中。但是，如果我在iPhone（iOS5）上访问JSFIDLE（以及在我的测试站点上），则文本只是左对齐的。所以，我想知道你们可能知道这是一个已知的问题（谷歌-似乎不是），你们知道一个解决办法吗

css:

js:

html:


测试
测试页
免费注册！
给我报名

text1

text2

等等……

这里是JSFIDLE的一些修补：只是向您展示了一些尝试移动占位符的方法

HTML

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
</head>
<body>    
    <section id="home" data-role="page">
        <header data-role="header">
            <h1>test page</h1>
        </header>
        <div data-role="content">
                <label>Left Align</label><input type="text" placeholder="email" class="leftText">
            <label>Right Align</label><input type="text" placeholder="email" class="rightText">
            <label>Center Text</label><input type="text" placeholder="email" class="centerText">
            <label>Pad Left</label><input type="text" placeholder="email" class="leftPadText">
            </div>
        <div data-role="popup" id="popupLogin" data-theme="a" class="ui-corner-all">
            <h3 class="centerText">Register free!</h3>

            <div class="popup">
                <form>                
                      <input type="email" name="email" id="email" class="centerText" placeholder="email" data-theme="a" style="text-align: center;"/>
                      <button type="submit" data-theme="b">Sign me up</button>

                      <p class="centerText">
                          text1<br/>
                          text2<br/>
                          etc...<br/>
                      </p>                
                </form>
            </div>
        </div>        
    </section>
    </body>
</html>

您使用

有什么原因吗？我知道这不会有什么不同。不，没有什么特别的原因，但正如你所说，这没有任何区别，所以我很好奇你为什么要问？我能够在Safari中复制这种行为，“电子邮件”是左对齐的。单击字段时，新文本居中。那么，您是在尝试将占位符或输入的文本居中？那只是无聊的好奇心。哦，你说得对！现在我想把占位符居中。注意到这一点真是太好了！没错！仅供参考，我在iPhone上测试了JSFIDLE，只是为了进行检查，结果显示占位符和文本居中，即iOS 6.0.1

$(document).ready(function(){
    $( "#popupLogin" ).popup( "open" );            
});

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
</head>
<body>    
    <section id="home" data-role="page">
        <header data-role="header">
            <h1>test page</h1>
        </header>

        <div data-role="popup" id="popupLogin" data-theme="a" class="ui-corner-all">
            <h3 class="centerText">Register free!</h3>
            <div class="popup">
                <form>                
                      <input type="email" name="email" id="email" class="centerText" placeholder="email" data-theme="a"/>
                      <button type="submit" data-theme="b">Sign me up</button>

                      <p class="centerText">
                          text1<br/>
                          text2<br/>
                          etc...<br/>
                      </p>                
                </form>
            </div>
        </div>        
    </section>
    </body>
</html>

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
</head>
<body>    
    <section id="home" data-role="page">
        <header data-role="header">
            <h1>test page</h1>
        </header>
        <div data-role="content">
                <label>Left Align</label><input type="text" placeholder="email" class="leftText">
            <label>Right Align</label><input type="text" placeholder="email" class="rightText">
            <label>Center Text</label><input type="text" placeholder="email" class="centerText">
            <label>Pad Left</label><input type="text" placeholder="email" class="leftPadText">
            </div>
        <div data-role="popup" id="popupLogin" data-theme="a" class="ui-corner-all">
            <h3 class="centerText">Register free!</h3>

            <div class="popup">
                <form>                
                      <input type="email" name="email" id="email" class="centerText" placeholder="email" data-theme="a" style="text-align: center;"/>
                      <button type="submit" data-theme="b">Sign me up</button>

                      <p class="centerText">
                          text1<br/>
                          text2<br/>
                          etc...<br/>
                      </p>                
                </form>
            </div>
        </div>        
    </section>
    </body>
</html>

input.centerText{
    text-align: center;
}


input.leftText {
    text-align: left;
}

input.rightText {
    text-align: right;
}

input.leftPadText {
    padding-left: 220px;
}