如何用jQuery的if语句判断元素是否为display:block并执行代码

看起来你需要在函数末尾检查目标div的display属性，进而决定是否执行blur方法对吧？这里给你两种常见场景的实现方式，根据你用的是jQuery还是原生JS来选：

如果你用jQuery（从变量名$suggestionsWrapper推测你可能在用） #

要准确获取元素的最终display值（不管样式是行内还是外部CSS定义的），用.css('display')方法最靠谱，直接判断即可：

场景1：判断是否为display:block，满足则执行blur #

// 在你的大型函数底部添加这段代码
if ($suggestionsWrapper.css('display') === 'block') {
  // 替换成你需要执行blur的元素，比如输入框
  $('#targetInput').blur();
}

场景2：判断是否为display:none，执行对应操作 #

如果你还是想实现最初的判断none的需求，只需要把判断条件改一下：

if ($suggestionsWrapper.css('display') === 'none') {
  // 这里写你要执行的操作逻辑
}

如果你用原生JS #

如果项目里没引入jQuery，用window.getComputedStyle()获取元素的计算样式，同样能拿到最终生效的display值：

// 假设suggestionsWrapper是原生DOM元素（没有$前缀）
const computedStyle = window.getComputedStyle(suggestionsWrapper);
if (computedStyle.display === 'block') {
  // 执行blur，比如获取输入框后调用方法
  document.getElementById('targetInput').blur();
}

小提示 #

• 先确认$suggestionsWrapper确实选中了正确的元素，可以先加一行console.log($suggestionsWrapper)看看输出，避免因为元素未找到导致判断失效。
• 如果只是想判断元素是否可见，jQuery里也可以用$suggestionsWrapper.is(':visible')，不过这个判断包含了display:none、visibility:hidden等多种不可见情况，如果你只需要精确判断display:block，还是用前面的方法更准确。

内容的提问来源于stack exchange，提问作者KatherineMichelle