javascript jQuery下拉菜单按钮影响整个页面

qyzbxkaa 于 2022-12-28 发布在 Java

关注(0)|答案(1)|浏览(135)

下面的代码是我用jQuery编写的，它影响了整个页面上的下拉菜单元素，这个问题的解决方案是什么？

$(".dropmenuac").on("click",function(){
        $(".dropmenulist").css("opacity","1");
        $(".dropmenulist").css("pointer-events","auto");
        $(".dropmenuac").css("display","none");
        $(".dropmenukapa").css("display","block");
    });

    $(".dropmenukapa").on("click",function(){
        $(".dropmenulist").css("opacity","0");
        $(".dropmenulist").css("pointer-events","none");
        $(".dropmenuac").css("display","block");
        $(".dropmenukapa").css("display","none");
    });

您可以在图片中看到细节。http://forumuni.com/drop.png
我在PHP页面上为共享创建了一个下拉菜单，但是jQuery代码影响了整个页面。

JavaScript

来源：https://stackoverflow.com/questions/74932861/jquery-dropmenu-button-affects-the-whole-page

1条答案

按热度按时间

nfg76nw01#

这是因为你同时针对所有的元素，你需要each()通过分别绑定每个元素的函数来解决这个问题。
就像这样：

$(".dropmenuac").each(function() {
  $(this).on("click",function(){
    $(".dropmenulist").css("opacity","1");
    $(".dropmenulist").css("pointer-events","auto");
    $(".dropmenuac").css("display","none");
    $(".dropmenukapa").css("display","block");
  });
});

$(".dropmenukapa").each(function() {
  $(this).on("click",function(){
    $(".dropmenulist").css("opacity","0");
    $(".dropmenulist").css("pointer-events","none");
    $(".dropmenuac").css("display","block");
    $(".dropmenukapa").css("display","none");
  });
});

赞(0）回复(0）举报 2022-12-28

我来回答

javascript jQuery下拉菜单按钮影响整个页面

1条答案

相关问题

热门标签

最新问答