Verbergen Sie dynamische JS-Schaltflächen basierend auf einem var-Wert

Question

Ich habe ein ähnliches Problem: Hide dynamically added buttons based on an if statement. Mit einem JS Mod für A Dark Room arbeite ich daran, meine JS Fähigkeiten zu verbessern. Keines dieser Schnipsel gehört mir, und beide funktionieren perfekt.

Dies ist der Code-Schnipsel die Schaltflächen zu erstellen:

build: function(buildBtn) { 
     var thing = $(buildBtn).attr('buildThing'); 
     if($SM.get('game.temperature.value') <= Room.TempEnum.Cold.value) { 
      Notifications.notify(Room, _("builder just shivers")); 
      return false; 
     } 

Dieser Ausschnitt stellt sicher, dass Schaltflächen sichtbar bleiben, aber ich möchte es so ändern, dass, wenn ein Maximalwert der Knopf versteckt erfüllt ist.

//show button if one has already been built 
if($SM.get('game.buildings["'+thing+'"]') > 0){ 
    Room.buttons[thing] = true; 
    return true; 
} 

Answer 1

Das Ausblenden und Anzeigen von Elementen erfolgt normalerweise über eine Klasse. Haben Sie eine CSS-Klasse wie diese

.hidden { 
    display : none' 
} 

Dann in Ihrem Javascript, hinzuzufügen oder entfernen hidden Klasse nach Ihrem Zustand

if(condition) { 
    $(element).addClass('hidden'); 
    } else { 
    $(element).removeClass('hidden'); 
    } 

Answer 2

Es ist schwer zu deuten darauf hin, weil es nicht genug Kontext ist. Der Ausschnitt, den Sie zeigen, ist möglicherweise nicht ausschließlich für die Kontrolle der Sichtbarkeit der Schaltfläche verantwortlich (trotz des Inline-Kommentars, der dies sagt). Daher funktioniert der folgende Vorschlag möglicherweise nicht und es wird mehr Informationen zu dem, was Sie versuchen, und mehr Code benötigt.

Wenn Sie Zugriff auf das Snippet haben, können Sie dort den maximalen Wert angeben. Wenn der Maximalwert eine Variable (d myCustomMaxValue) und es ist in ihrem Umfang dann meine beste Vermutung wäre es hinzuzufügen hier:

var myCustomMaxValue = 88; 
var someOtherVariableInScope = 50 

//show button if one has already been built 
if($SM.get('game.buildings["'+thing+'"]') > 0){ 
    //add your condition here and yield true/false 
    var myCustomCondition = someVariableInScope > myCustomMaxValue; 
    Room.buttons[thing] = myCustomCondition; 
    return myCustomCondition; 
} 

Ich würde das debug; Stichwort vorschlagen. Legen Sie es in das Snippet und öffnen Sie die Entwicklertools Ihres Browsers und der Debugger wird getroffen. Sie können dann die Variablen im Gültigkeitsbereich überprüfen und überprüfen, ob das Snippet für das dynamische Anzeigen und Ausblenden der Schaltfläche verantwortlich ist.

//show button if one has already been built 
if($SM.get('game.buildings["'+thing+'"]') > 0){ 
    debug; 
    Room.buttons[thing] = myCustomCondition; 
    return myCustomCondition; 
}