菜鸟教程小白 发表于 2022-12-13 11:58:05

html - 使上一个/下一个按钮适用于 iOS 上的复选框


                                            <p><p>在 iOS 上,当在网页上填写表单时,键盘上有 Next 和 Previous 按钮,其作用类似于真实键盘上的 Tab 键。我们有一个 Web 应用程序,我使用 PhoneGap 将其实现为一个应用程序,并且 Next 和 Previous 按钮跳过复选框,就好像它们不存在一样。</p>

<p>有没有什么方法可以在 iOS 上使用 PhoneGap/UIWebView/Safari 使 Next 和 Previous 按钮与复选框一起使用?</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>这可以仅使用 HTML 来模拟。</p>

<p>在复选框之前插入一个文本输入元素。添加 JavaScript,以便当输入具有焦点时按下某个键会更改复选框状态。</p>

<p>这里是 <a href="http://jsbin.com/emigec/86" rel="noreferrer noopener nofollow">a jsbin example</a>你可以<a href="http://jsbin.com/emigec/86/edit" rel="noreferrer noopener nofollow">edit the source</a> .关于此示例的说明:</p>

<ul>
<li><p>不要使用 <code><fieldset></code> - 使用长按输入强制选择文本 - 在 jsbin 的编辑模式下关闭 iOS 6(必须与 jsbin 代码或 iframe 进行一些交互),并始终隐藏插入符号(这在这种情况下听起来很有用,但不是!)。在我看来是因为 Safari 的一个错误错误(但我并没有真正研究它,也没有报告它,因为太麻烦了。)</p></li>
<li><p>使用 <code><option></code> 元素的 <code>visibility:hidden;</code> 想法不起作用,因为如果用户触摸选项,则键盘会隐藏。</p></li>
<li><p>我并没有花太多时间为重点复选框寻找一种好的样式 - 如果有人想出更好的东西,请发表评论。</p></li>
<li><p>在 jsbin 示例中有一些垃圾内容,这些想法无法隐藏闪烁的插入符号。如果有隐藏插入符号的更简洁的解决方案,我会很感兴趣。</p></li>
<li><p>需要进行一些浏览器嗅探才能将此修复应用到 iOS 设备。</p></li>
<li><p>这不是标准的 iOS UI 行为,因此在使用其他应用程序时可能会使用户感到困惑,或产生其他负面影响。 future 版本的 Mobile Safari 很容易破坏解决方案。</p></li>
<li><p>我尝试了几种不同的隐藏插入符号的方法,最有效的似乎是使用 <code>-webkit-transform: scale(0.01);变换:比例(0.01);</code>。使用字体大小:1px;几乎可以工作,但是当输入获得焦点时会导致 iPhone 缩放(测试 iPad iOS5 并且它没有缩放,测试 iPhone iOS6 并且它缩放)。 </p></li>
</ul></p>
                                   
                                                <p style="font-size: 20px;">关于html - 使上一个/下一个按钮适用于 iOS 上的复选框,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/9560620/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/9560620/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: html - 使上一个/下一个按钮适用于 iOS 上的复选框