如何添加第二次點擊到同一個div？

我有兩個盒子。我想創建函數，這會給我一些功能。如何添加第二次點擊到同一個div？

如果我點擊黑框顯示紅色的那個。
當我再次單擊一個黑匣子時，我想隱藏紅框。

這是我做了什麼：

var showMeRedBox = document.getElementsByClassName('box2_red')[0] 
 
var blackBox = document.getElementsByClassName('box1_black')[0] 
 
var redBox = document.getElementsByClassName('box1_black')[0] 
 
var hideRedBox = document.getElementsByClassName('box2_red')[0] 
 

 

 

 
var showMe = function(show) { 
 
    showMeRedBox.style.display = show 
 
} 
 
blackBox.onclick = function() { 
 
    showMe('inline-flex'); 
 
} 
 

 

 

 
var hideMe = function(hide) { 
 
    hideRedBox.style.display = hide 
 
} 
 
blackBox.click = function() { // here should be seocnd click, when I want to hide the red box 
 
    hideMe('none'); 
 
}

難道有人給我建議，我該怎麼辦呢？謝謝鮎魚

來源

2017-06-28 Magdalena Dering

的'click'處理程序只接受一個事件，通過創建第二，您正在覆蓋最初的點擊處理程序。 'addEventListener'允許分配多個事件，但是，您只需要點擊一下。點擊，檢查顏色，並顯示正確的框。再次點擊，做同樣的事情。讓邏輯爲你做額外的點擊處理程序 –

在高層次上，你想要的不是「創建第二次點擊」。你想要的是有一個*單*單擊處理程序（你有），並在該處理程序中，檢查目標元素的當前狀態並相應地修改該狀態。所以基本上「如果顯示紅色框，隱藏它，否則，顯示它」。 – David

您可以使用一個變量來保存的Redbox的狀態，然後點擊裏面問它：

var isHidden = false; 
blackBox.click = function() { 
    if (isHidden) { 
     isHidden = false;//show the box 
    } else { 
     isHidden = true; 
     hideMe('none'); 
    } 
}

來源

2017-06-28 16:06:47 arracso

如果你熟悉

您可以使用AJAX

參考的https://www.youtube.com/watch?v=rJesac0_Ftw

AJAX部分希望它可以幫助

來源

2017-06-28 16:24:57

如何添加第二次點擊到同一個div？

回答

相關問題