关于选项卡，JS鼠标移入移出事件怎么改成点击事件？
<script>$(".dt_tabli").mouseenter(function(){if(!$(this).hasClass(".showed")){$(".sho...
<script>
$(".dt_tab li").mouseenter(function () {
if(! $(this).hasClass(".showed")){
$(".showed").removeClass("showed");
$(this).addClass("showed");
$(".dt_tab>div").eq($(this).index()).addClass("showed");
}
})
</script>
这是选项卡的JS代码，请问怎么把移入移出切换改成点击切换？而且这段不能放在<head>里，放了不生效，放在选项卡后面才生效，比较影响代码的浏览性，怎么改能达到移入移出切换变成点击切换和放到<head>里也生效？ 展开
$(".dt_tab li").mouseenter(function () {
if(! $(this).hasClass(".showed")){
$(".showed").removeClass("showed");
$(this).addClass("showed");
$(".dt_tab>div").eq($(this).index()).addClass("showed");
}
})
</script>
这是选项卡的JS代码，请问怎么把移入移出切换改成点击切换？而且这段不能放在<head>里，放了不生效，放在选项卡后面才生效，比较影响代码的浏览性，怎么改能达到移入移出切换变成点击切换和放到<head>里也生效？ 展开
1个回答
展开全部
mouseenter 改成 click
放在 head 不生效是因为选项卡的元素还没有生成，所以这个事件无法绑定到目标对象上。
可以改成下面的代码，在网页加载完毕后再绑定事件，这样就可以放在 <head> 中：
$(document).ready(function(){
$(".dt_tab li").mouseenter(function () {
if(! $(this).hasClass(".showed")){
$(".showed").removeClass("showed");
$(this).addClass("showed");
$(".dt_tab>div").eq($(this).index()).addClass("showed");
}
})
})
放在 head 不生效是因为选项卡的元素还没有生成，所以这个事件无法绑定到目标对象上。
可以改成下面的代码，在网页加载完毕后再绑定事件，这样就可以放在 <head> 中：
$(document).ready(function(){
$(".dt_tab li").mouseenter(function () {
if(! $(this).hasClass(".showed")){
$(".showed").removeClass("showed");
$(this).addClass("showed");
$(".dt_tab>div").eq($(this).index()).addClass("showed");
}
})
})
更多追问追答
追问
非常感谢大佬，弄好了之后又发现一个问题，那就是我点击第二张图片，他会刷新显示第二个栏目的图片，点击第三张显示第三个栏目，而且上面绿色区域不会跟着显示，我只有4个栏目，点击第5张就会显示空白了，这个js要怎么改能取消点击下面内容图片跳转栏目？
追答
这个需要实际调试才能解答你，就现有的代码无法凭空解答。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
