Javascript Span下拉列表选择Jquery

JavaScript

function myFunction() {
    if ($(".x-span-drop-menu").css("display", "none")) {
        $(".x-span-drop-menu").css("display", "block");
    } else {
        $(".x-span-drop-menu").css("display", "none");
    }
}

下拉菜单会下拉，但不会再次消失。 这是因为我将其写入Jquery 在Js中，它使用

$（“.x-span-drop-menu”）.css（“display”，“none”）

在

条件下工作，如果设置css属性，函数将返回一个truthy值，以便执行trueblock，从而使元素再次可见

function myFunction() {
    var span = $(".x-span-drop-menu");
    if (span.css("display") == "none") {
        span.css("display", "block");
    } else {
        span.css("display", "none");
    }
}

我会推荐与您一起使用

由于您已经在使用jQuery，使用以下功能可能很简单：

相当于：

if ( display === true ) {
  $( ".x-span-drop-menu" ).show();
} else if ( display === false ) {
  $( ".x-span-drop-menu" ).hide();
}

使用切换功能显示和隐藏。很简单

$(".x-span-drop-menu").toggle();

最好切换css类，如使用样式隐藏
：

.is-hidden {
    display: none;
}

因此，您的功能将是：

$(".x-span-drop-menu").toggle();

.is-hidden {
    display: none;
}

function toggleFunc() {
    $(".x-span-drop-menu").toggleClass('is-hidden');
}