Javascript 隐藏div，除非它有来自onclick的源

如果有一个源来自单击.item，那么如何仅显示.model容器中的.model item div

示例：如果我单击了第一个项目，则只有项目img div会显示，因为它是从函数接收源的唯一div。项目文本和项目子文本都将保持隐藏状态，因为它们没有源

$.container.onclick、.item、函数{ var t=$this.closest.item； $item-text.textt.find.item-text.text； $item-sub-text.textt.find.item-sub-text.text； var a=t.find.item-img.attrsrc； $item-img.cssbackground-image，'url'+a+''； }; .身体{ 显示器：flex； } 容器 .莫代尔{ 显示器：flex； 弯曲方向：立柱； 填充：20px； } .集装箱{ 边框：1px纯蓝色； } .莫代尔{ 背景：eee } 项目 .模态项{ 宽度：50px； 高度：50px； 光标：指针； 边框：1px实心； } .项目img{ 高度：50px； 宽度：50px； 边界：无； } 项目img{ 背景尺寸：包含； 背景重复：无重复； 背景位置：中心； }

文本

子文本

您可以使用隐藏或显示函数jQuery

function checkShowHide(text, ele) {
  if (text !== '') {
    $(ele).show();
    $(ele).text(text);
  } else {
    $(ele).hide();
  }
}
$(".container").on("click", ".item", function() {
  var t = $(this).closest(".item");
  var itemText = t.find(".item-text").text();
  var itemSubText = t.find(".item-sub-text").text()
  var itemBG = t.find(".item-img").attr("src");
  checkShowHide(itemText, '#item-text');
  checkShowHide(itemSubText, '#item-sub-text');

    var a = t.find(".item-img").attr("src");
  if (a !== '') {
    $("#item-img").show();
    $("#item-img").css("background-image", 'url("' + a + '")'); 
  } else {
    $("#item-img").hide();
  }

});

这是我的解决办法。您可以签入我的代码笔：