單擊另一個圖像時如何隱藏另一個圖像頂部的圖像

Question

我有6個圖像作為點，我點擊了動畫。 所有六個圖像都有相應的文字發光/顏色：白色點擊其各自的點/圖像現在問題是我有一個圖像/點上的圖像/圖標，當我點擊另一個圖像/點時沒有隱藏

兩個問題 - 1.圖標無法隱藏2.點擊另一個圖像/點時，點/圖像無法再次點擊

提供視頻以便更好地理解（ https://streamable.com/ab999 ）

在這個視頻中，你會看到我有一個點/圖像及其各自的文本（構建）我編碼它就像頁面加載它自動被點擊和動畫發生。（這應該發生的事情正在發生）

你會看到當我點擊任何其他圖像/點（構建文本圖像上的黑色圖標/點不隱藏）和構建文本圖像/圖標不能再次點擊，因為黑色/圖標在那里並使其無法點擊

我正在嘗試的Jquery就是這個

$(function() {
  if($("#img1").click()){
    $(".icon").css("display","block");
    console.log("if");
  }
  else{
    $(".icon").css("display","none");
    console.log("else");
  }
});

我已經把console.log只是檢查，但我的控制台只顯示（“如果”）永遠不會去（“其他”）

img1是點/圖像的id

.icon是一個黑色圖標類，它位於構建圖像的頂部，具有css屬性位置：相對

 <li class="paralx-dots"><span class="icon-text" id="1">Build</span><img src="images/Circle 1- Blue .svg" class="paralx-dot-1" class="Active" data-box="div1" id="img1" tabindex="0"><span class="icon-position"><img src="images/logos/noun_build_1909132.svg" class="icon"></img></span></img></li> 

我希望當我點擊任何其他圖像/點時，黑色圖標隱藏（顯示無），當我再次點擊點/圖像（構建）時，它再次出現

Answer 1

它始終打印“if”的原因是$ .click（）實際上是.trigger（“click”）的快捷方式，它將始終返回一個jQuery對象。

jQuery單擊引用

在我看來，你實際上想要使用事件處理程序。 嘗試$(".icon").on('click', yourFunction)

Answer 2

嘗試這個

 $(function() { $(".icon").css("display","none"); $("#img1").on("click", function() { $(".icon").css("display","block"); console.log("click"); })) }); 

Answer 3

你必須添加動作點擊這樣的圖像。

$('img').click(function () { 
  if (this.id === 'img1') { 
    $(".icon").css("display","block"); 
  } else { 
    $(".icon").css("display","none"); 
  } 
})

請注意$("#img1").click()將觸發click。