码迷,mamicode.com
首页 > 移动开发 > 详细

触屏版类似刷新页面文本框获取焦点的同时弹出手机键盘的做法

时间:2015-05-11 10:33:19      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:

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

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>

 

触屏版类似刷新页面文本框获取焦点的同时弹出手机键盘的做法

标签:

原文地址:http://www.cnblogs.com/dearxinli/p/4493605.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!