So deaktivieren Sie onclick einer Klasse

Question

Ich würde gerne wissen, wie das Onclick-Ereignis einer bestimmten Klasse zu deaktivieren. Mir ist bewusst, dass Sie das CSS pointer-events: none; verwenden können, aber ich möchte, dass die Hover-Ereignisse immer noch funktionieren, klicken Sie einfach darauf, um deaktiviert zu werden.

Wie kann ich sie später wieder aktivieren? Zum Beispiel:

if (document.getElementById('wuzi').backgroundColor == "green") { 
//disable onclick 
} else { 
//enable onclick 
} 

Danke

Answer 1

Sie können einfach den Hörer hinzufügen und entfernen zu ‚Klick‘:

var wuzi = document.getElementById('wuzi'); 
if (wuzi.backgroundColor === "green") { 
    wuzi.removeEventListener('click'); 
} else { 
    wuzi.addEventListener('click', clickHandler); 
} 

wo clickhandler Ihre Funktion ist es, den Klick für die Handhabung.

Answer 2

können Sie versuchen, wie unten:

var element = document.getElementById('wuzi') 
    if (element .backgroundColor == "green") { 
    //disable onclick 
     element.onclick = ''; 
    } else { 
    //enable onclick 
    } 

Answer 3

Ich würde vorschlagen, Sie CSS-Klasse hinzuzufügen, statt backgroundColor zu vergleichen, dann setzen überprüfen disabled Eigenschaft basierend auf Klasse

var element = document.getElementById('wuzi'); 
element.disabled = element.classList.contains("foo"); 

Answer 4

Onclick Rückkehr falsch versuchen:

var element = document.getElementById('wuzi') 
    if (element .backgroundColor == "green") { 
    //disable onclick by returning false from onclick 
     element.onclick = return false; 
    } else { 
    //enable onclick or do some appropriate action 
    } 

Answer 5

Ich hoffe, dass dir das hilft

if (document.getElementById('wuzi').style.backgroundColor === "green") { 
//disable onclick 

this.onclick=null 
} else { 
//enable onclick 
this.onclick=my_function; 
} 

definieren Sie Ihre Funktion, wie Sie

function my_function() 
{ 
    alert('enable'); 
}