开发者社区> 问答> 正文

aotufocus以及jquery的focus在钉钉上无法自动聚焦

1、用了H5的aotufocus属性,在PC端主流浏览器上可以成功聚焦 2、在移动端十分诡异,初次加载页面时无法聚焦,刷新一次页面就可以聚焦 (ios Safari浏览器加载后可实现聚焦,用了其他浏览器如:手机端傲游,则需要刷新一次页面才可聚焦) 3、本人发现钉钉内置的浏览器也存在上述问题,需要刷新一次页面才可聚焦 4、本人也尝试过使用$("#input1").focus();来聚焦,发现问题还是存在


测试代码如下:
<!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">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name = "format-detection" content = "telephone=no">  
    <title>聚焦测试</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link href="//cdn.bootcss.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>    
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="//cdn.bootcss.com/bootstrap/4.0.0-alpha.2/js/bootstrap.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        function f_focus () {
            $("#input1").focus();
        }

    </script>

</head>
<body style="margin:1em;">
    
    <form id="form1" autocomplete="off">
        
        <div class="form-group">
            <label for="input1">输入框1</label>
            <input type="text" class="form-control" id="input1" name="input1" placeholder="输入框1" autofocus>
        </div>

        <div class="form-group">
            <label for="input2">输入框2</label>
            <input type="text" class="form-control" id="input2" name="input2" placeholder="输入框2">
        </div>

        <div class="form-group">
            <button id="btn_cfm" type="button" class="btn btn-primary btn-lg btn-block" onclick="f_focus();">聚焦</button>
        </div>

    </form>

</body>
</html>


展开
收起
ktos 2016-05-31 10:42:29 6651 0
2 条回答
写回答
取消 提交回答
  • 前端开发工程师~喜欢前端技术~觉得js可以用于全栈开发,还在学习摸索中的小白一枚~
    回 1楼靖山的帖子
    请问。。那IOS版和安卓版分别是什么采用什么内核呢?不知道的话也没法兼容哇。。
    2017-09-28 11:30:42
    赞同 展开评论 打赏
  • 钉钉iOS的浏览器由于苹果开发框架给出的实现和safari并不相同;钉钉iOS和安卓两端的浏览器也不同;所以在做页面的时候需要开发者来确保兼容性
    2016-05-31 15:40:46
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关课程

更多

相关电子书

更多
钉钉小程序——为工作方式插上翅膀 立即下载
钉钉客户端自动化的应用 立即下载
使命必达 —— 钉钉企业级 消息服务的机遇与挑战 立即下载