AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

jquery写出移入移出事件

2023-07-22 57
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： jquery写出移入移出事件 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="js/jquery-3.6.0.js"></script>
    <style>
      #box{
        width: 50%;
        height: 300px;
        margin-left: 30%;
        margin-top: 300px;
      }
      #box_one input{
        width: 50%;
        height: 20px;
        border-radius: 20px;
      }
      #box_tow{
        width: 52%;
        height: 100px;
        background-color: bisque;
        border-radius: 20px;
        /* 显示滚动条 */
        overflow-y: scroll;
        display: none;
      }
    </style>
        <title></title>
    </head>
    <body>
       <div id="box">
        <div id="box_one">
          <input type="text" placeholder="请输入">
        </div>
    <div id="box_tow">
      <p>求关注</p>
      <p>求点赞</p>
      <p>求关注</p>
      <p>求点赞</p>
    </div>
       </div>
        <script type="text/javascript">
            $('#box_one').mousemove(function() {
              $("#box_tow").show()//当鼠标放到input里时显示#box_tow里的数据
            })
            $('#box_tow').mousemove(function() {
              $("#box_tow").show()//把鼠标放到box_tow的时候继续显示避免隐藏
            })
            $('#box_tow').mouseout(function() {
              $("#box_tow").hide()//鼠标离开input后隐藏box_tow
            })
        </script>
    </body>
</html>
文章标签：
JavaScript
关键词：
jQuery事件
jQuery移出
秋之合
目录
相关文章
N..
|
4月前
|
JavaScript 前端开发
jQuery事件处理
jQuery事件处理
N..
37 1
听白
|
3月前
|
JavaScript 前端开发
jQuery 事件
jQuery 事件
听白
26 1
听白
|
3天前
|
JavaScript
jQuery 事件
jQuery 事件
听白
21 10
听白
|
8天前
|
JavaScript
jQuery 事件 方法
jQuery 事件 方法
听白
20 3
游客jjw5lou74ja6k
|
1月前
|
Web App开发 JavaScript Android开发
重载jquery on方法实现click事件在移动端的快速响应
重载jquery on方法实现click事件在移动端的快速响应
游客jjw5lou74ja6k
30 1
好奇的菜鸟
|
3月前
|
JavaScript 前端开发 开发者
jQuery中的ready()函数：优雅地处理页面加载事件
jQuery中的ready()函数：优雅地处理页面加载事件
好奇的菜鸟
25 0
爱吃糖的范同学
|
4月前
|
JavaScript 前端开发 C++
【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同？
【5月更文挑战第2天】【Web 前端】JavaScript window.onload 事件和 jQuery ready 函数有何不同？
爱吃糖的范同学
62 2
jianz123
|
4月前
|
Web App开发 JavaScript 前端开发
jquery的冒泡事件event.stopPropagation()
jquery的冒泡事件event.stopPropagation()
jianz123
32 0
a15034260562-24955
|
4月前
|
JavaScript 前端开发
jQuery中的事件与动画
jQuery中的事件与动画
a15034260562-24955
25 0
a15034260562-24955
|
4月前
|
JavaScript
jQuery动画与事件概念以及语法
jQuery动画与事件概念以及语法
a15034260562-24955
27 0