问题是:js是如何实现鼠标移动到不同栏位切换对应的显示内容的?

 我来答
百度网友a19d193
推荐于2016-04-12 · TA获得超过3446个赞
知道大有可为答主
回答量:1464
采纳率:100%
帮助的人:1452万
展开全部

给你一个示例代码吧,引用了jQuery框架。你可以将这个js文件下载到本地或直接使用例子中的远程地址(不过由于国内google经常访问不了建议下载下来)

<!DOCTYPE HTML>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        function switchContentBox(obj) {
            obj = $(obj);
            var contentBox = obj.parents('div.box:first').children('div.content');
            var index = obj.attr('item');
            contentBox.children().hide();
            contentBox.children(':eq(' + index + ')').show();
        }
    </script>
</head>
<body>
<div class="box">
    <div class="title">
        <span item="0" onmouseover="switchContentBox(this)">Demo1</span>
        <span item="1" onmouseover="switchContentBox(this)">Demo2</span>
    </div>
    <div class="content">
        <div>Content of Demo1</div>
        <div style="display: none;">Content of Demo2</div>
    </div>
</div>
</body>
</html>
微测检测5.10
2023-05-10 广告
您好!建议咨 深圳市微测检测有限公司,已建立起十余个专业实验室,企业通过微测检测就可以获得一站式的测试与认 证解决方案;(EMC、RF、MFi、BQB、QI、USB、安全、锂电池、快充、汽车电子EMC、汽车手机互 联、语音通话质量),认证遇... 点击进入详情页
本回答由微测检测5.10提供
匿名用户
2018-05-17
展开全部
鼠标的移入(onmouseover)事件实现。
1、当鼠标移入一个栏位时,触发移入事件,这个事件负责将当前栏位对应内容显示,其他内容隐藏
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
方范贺高
2018-06-11 · TA获得超过168个赞
知道小有建树答主
回答量:248
采纳率:40%
帮助的人:49.4万
展开全部
mouseenter,mouseleave等mouse事件触发对应模块的显示隐藏
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(1)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式