Html通过jquery/javascript在iphone上保持键盘可见_Javascript_Jquery_Iphone_Ios5_Jquery Mobile

Html通过jquery/javascript在iphone上保持键盘可见

javascript jquery iphone ios5 jquery-mobile

Html通过jquery/javascript在iphone上保持键盘可见,javascript,jquery,iphone,ios5,jquery-mobile,Javascript,Jquery,Iphone,Ios5,Jquery Mobile,每当焦点以编程方式从一个输入字段移动到另一个输入字段时，我想让键盘在iphone上保持可见。当我第一次设置焦点时，代码可以正常工作，但后来没有这样做下面是一段代码。你知道如何让键盘保持可见吗？现场演示，在iphone或ipad上打开 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <style> body{background-color: #efefef;} input:focus

每当焦点以编程方式从一个输入字段移动到另一个输入字段时，我想让键盘在iphone上保持可见。当我第一次设置焦点时，代码可以正常工作，但后来没有这样做

下面是一段代码。你知道如何让键盘保持可见吗？现场演示，在iphone或ipad上打开

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<style>
body{background-color: #efefef;}
input:focus{ color:red; font-size:30px; background: rgba(0,0,0,0.2); }
.button {
  font-family: Arial; color: #ffffff; font-size: 35px; padding: 10px;
  text-decoration: none; -webkit-border-radius: 28px; -moz-border-radius: 28px;
  -webkit-box-shadow: 0px 1px 3px #666666; -moz-box-shadow: 0px 1px 3px #666666;
  text-shadow: 1px 1px 3px #666666; border: solid #005157 2px;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#c3f7f4), to(#095461));
  background: -moz-linear-gradient(top, #c3f7f4, #095461);
}
.button:hover { background: #19ad02; }
</style>
    <head>
        <title>I Pad</title>
        <script type="text/javascript" src="./jquery-1.7.2.min.js"></script>
    </head>
    <body>
        <button type="button" name="" id="name" value="" class="button">Submit</button>
        <input type="text" id="kb" value="" class="button"/>
        <input type="text" id="kb1" value="" class="button"/>
        <script type="text/javascript">
                $('#name').click(function(){            
                    $('#kb').focus();
                    $('#kb').blur(); //not important
                    $('#kb1').focus();
                });
        </script>
    </body>
</html>


正文{背景色：#efefef；}
输入：焦点{颜色：红色；字体大小：30px；背景：rgba（0,0,0,0.2）；}
.按钮{
字体系列：Arial；颜色：#ffffff；字体大小：35px；填充：10px；
文本装饰：无；-webkit边框半径：28px；-moz边框半径：28px；
-webkit盒影：0px 1px 3px#666666；-moz盒影：0px 1px 3px#666666；
文本阴影：1px 1px 3px#666666；边框：实心#005157 2px；
背景：-webkit梯度（线性，0.0，0.100%，从（#c3f7f4）到（#095461））；
背景：-莫兹线性梯度（顶部，#c3f7f4，#095461）；
}
.按钮：悬停{背景：#19ad02；}
我垫
提交
$（'#name'）。单击（函数（）{
$（'#kb'）.focus（）；
$（'#kb'）.blur（）；//不重要
$（'#kb1'）.focus（）；
});

*编辑#2*

看来这个问题没有解决办法（至少到目前为止）

*结束编辑#2*

我认为，当你在Safari中“模糊”一个字段时，它会隐藏键盘，然后当你“聚焦”一个新字段时，它会显示键盘。所以，除非你在做一些奇怪的事情（比如在聚焦新的区域后手动模糊旧的区域），否则我真的不理解你为什么会有你描述的行为

*编辑*

只要看看你的代码，你就会意识到你最后要做的事情就是聚焦，这会让键盘重新启动。但是，您正在进行手动模糊；我会先把它移除，看看它是否能解决问题

*结束编辑*

不过，解决这个问题的一个可能的解决方案是从

onBlur

事件处理程序内部使用

e.preventDefault（）

。这应该可以防止浏览器隐藏键盘的默认行为。

我认为iPhone的设计方式是只通过一些用户操作触发键盘。这就是为什么通过手动单击按钮，可以将焦点移动到输入框并打开键盘，但任何其他以编程方式单击按钮并从按钮的事件处理程序将焦点设置为输入框以打开键盘的尝试都不会起作用

我想我剩下的唯一选择是将我所有输入框的属性设置为只读，然后单击它，在它上面打开一个透明的输入框。然后从透明输入框中获取值，并将其设置为我想要的只读输入框

然后继续将透明输入框的位置更改为我设置值的只读输入框

如果有人对此有更好的想法，我愿意听取建议。

“只要焦点设置为输入字段，我就想在iphone上显示键盘”这不只是iphone上默认的浏览器行为吗？是的，但请阅读全文。当我以编程方式将焦点移动到另一个输入框时，键盘隐藏；这有点让人困惑，因为听起来好像您试图用代码复制默认行为。您可能需要重新表述您的问题，以便更清楚地表明您正在尝试使用代码来解决有问题的浏览器行为（而不是首先尝试使用代码来显示键盘）。我已经复制了问题：访问以查看它是否工作。orry。。这不起作用，试着在ipad或iphone上打开。当焦点移动到第二个文本框时，键盘会立即隐藏。这段代码复制了我在其他应用程序中需要的行为，在这些应用程序中，我经常需要以编程方式将焦点移动到其他输入框，因此我无法删除第一个焦点。我尝试了你的另一种解决方案，据我所知，你建议了类似于$（'#kb'）.onblur（e.preventDefault（））的东西，但即使这样也不起作用。“所以我不能移除第一个焦点”-问题不是（我认为）第一个焦点，而是模糊。至于尝试我的第二个想法，你很接近；试试

$（'#kb'）.blur（函数（e）{e.preventDefault（）}）

。我不需要blur命令，起初我没有它，但只是为了尝试一下，我把它放在那里了。我试过你的第二个想法，但不管有没有模糊，都是一样的。另一个想法是：尝试在

焦点

之后调用

单击

，这样

$（'#kb1'）.focus（）.click（）我之前也试过，但效果不好（我甚至试图在第一次模糊和第二次聚焦之间设置一些延迟，但键盘仍然隐藏。