jQuery 回车换行、input悬浮全选...

最新推荐文章于 2022-02-27 17:58:55 发布

卡尔特斯

最新推荐文章于 2022-02-27 17:58:55 发布

阅读量436

点赞数

分类专栏： jQuery 文章标签： jquery

本文链接：https://blog.csdn.net/zz00008888/article/details/109327065

版权

jQuery 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="jquery-3.4.1.js"></script>
  <script>
    $(function () {
      // 案例一: 回车换行
      // $('input').keyup(function (e) {
      //   console.log(e);
      // })
      // $('input').on('keyup', function (e) {
      //   if (e.keyCode === 13) {
      //     // 按了回车键，跳转到下一行
      //     $(this).next().next().focus();
      //     // 转成js对象调用 focus() 也是一样。
      //     // $(this).next().next()[0].focus();
      //   }
      // })

      // 案例二: 放上去光标出来
      // $('input').on('mouseenter', function (e) {
      //   $(this).focus()
      // })

      // 案例三: 放上去全部选择光标出来
      // $('input').on('mouseenter', function (e) {
      //   $(this).select()
      // })
    })
  </script>
</head>
<body>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
  <input type="text" value="dzm"><br>
</body>
</html>

案例一：

案例二：

案例三：

卡尔特斯

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
jQuery 回车换行、input悬浮全选...

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="jquery-3.4.1.js"></script&
复制链接

扫一扫