博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

手机触屏版想要自动弹出键盘要满足的三个条件:

1、文本框获取焦点

2、手触屏该页面的屏幕

3、无延迟

实现实例(类似微信微博):

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<style>
    .page{
        width:100%;
        height:400px;
        background:#333;
        overflow:hidden;
    }
    .page a{
        display: block;
        width:50px;
        height:50px;
        margin:100px auto;
    }
    .com {
        display: none;
        width:100%;
        height:500px;
        overflow:hidden;
    }
    .com textarea{
        display: block;
        width:90%;
        height:200px;
        margin:50px auto;
    }
</style>
<body>
     <div class="page">
         <a href="javascript:void(0);">评论</a>
     </div>


     <div class="com">
         <textarea></textarea>
     </div>
</body>
<script>
      $('.page a').on('click',function(){
          $('.page').hide()
          $('.com').show()
          $('.com textarea').focus()
      })
      
</script>

</html>