问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

jq 里面如何让 input 一直都获取焦点，请大佬们解答一下 ，谢谢？

头像
时倾
    611546

    我认为的是只要在失去焦点的时候在调用focus() 就可以持续的获取焦点
    图片.png

    jquery前端
    阅读 2.1k
    2 个回答
    得票最新
    头像
    陟上晴明
      22k145391
      ✓ 已被采纳

      其实就很简单啊，监听一下 input 元素的 blur 事件就好了呀。

      <body>
  <input type="text">
</body>
<script>
$().ready(function(){
  $('input').focus()
})
$('input').on('blur',function(){
  $('input').focus()
})
</script>

      CodePen Demo

      FireFox 浏览器下，不能直接在元素失焦时使元素获取焦点，所以在外层套一个 setTimeout 即可。应该是一个BUG，这个问题已经存在很久了。

      <body>
  <input type="text">
</body>
<script>
$().ready(function(){
  $('input').focus()
})
$('input').on('blur',function(){
  setTimeout(function(){
    $('input').focus()
  }, 0)
})
</script>
      本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。
      头像
      Rock
        15117

        在离开焦点事件里获取焦点？

        <!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
$("#name").focus();
 $("#name").blur(function(){
    $("#name").focus();
          });
});
</script>
</head>
<body>
<input id="name" ></input>

<input id="性别"></input>
</body>
</html>

        点这个网页，然后把上面的代码都复制进去，接着点“运行代码”，最后点第2个文本框，你试试效果
        https://www.w3school.com.cn/tiy/t.asp?f=jquery_hide

        image.png
        在红框区域里才有效果。超过了红框就是网页外面了，确实不受控制了。

        撰写回答
        你尚未登录，登录后可以
        • 和开发者交流问题的细节
        • 关注并接收问题和回答的更新提醒
        • 参与内容的编辑和改进，让解决方法与时俱进
        推荐问题