2016-08-03 32 views
1

Ich habe eine Funktion mit verschiedenen if-Anweisungen erstellt, die ausgeführt werden, wenn ein Parameter wahr ist. Aber falsch als Parameter zu gehen, scheint nicht zu funktionieren. Was mache ich falsch?Javascript boolescher Parameter nicht korrekt übergeben

function easySlider(titleP, subTitleP, overlayP) { 
 
    var title = titleP; 
 
    var subTitle = subTitleP; 
 
    var overlay = overlayP; 
 

 
    if (title === true) { 
 
    $(".sliderTitle").css("display", "block"); 
 
    } else { 
 
    $(".sliderTitle").css("display", "none"); 
 
    } 
 

 
    if (subTitle === true) { 
 
    $(".sliderSubTitle").css("display", "block"); 
 
    } else { 
 
    $(".sliderSubTitle").css("display", "none"); 
 
    } 
 

 
    if (overlay === true) { 
 
    $(".sliderOverlay").css("display", "block"); 
 
    } else { 
 
    $(".sliderOverlay").css("display", "none"); 
 
    } 
 
} 
 

 
easySlider(true, false, true);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<h2 class="sliderTitle">Hello sliderTitle</h2> 
 
<h3 class="sliderSubTitle">Hello sliderSubtTitle</h3> 
 
<div class="sliderOverlay">Hello sliderOverlay</div>

+2

Andere versuchen, als nicht die DOM-Zugriff Caching und die nicht benötigten Zuweisungen, mit diesem Code falsch es gibt nichts, ich sehen kann. Auch neugierig, warum Sie '.hide' und' .show' nicht verwenden ... –

+0

Haben Sie versucht mit einem doppelten gleich (==) in der if-Anweisung? – therealbischero

+2

_But übergeben falsch, wie ein Parameter nicht funktioniert_ Was nicht funktioniert? Beschreiben Sie das Problem bitte –

Antwort

1

können Sie diese

<div class="sliderTitle"></div> 
<div class="sliderSubTitle"></div> 
<div class="sliderOverlay"></div> 

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
<script> 
    function easySlider(title, subTitle , overlay) { 
     var titleDisplay  = title ? 'block' : 'none'; 
     var subTitleDisplay = subTitle ? 'block' : 'none'; 
     var overlayDisplay = overlay ? 'block' : 'none'; 

     $(".sliderTitle").css("display", titleDisplay); 
     $(".sliderSubTitle").css("display", subTitleDisplay); 
     $(".sliderOverlay").css("display", overlayDisplay); 
    } 

    easySlider(false, false, false); 
</script> 
0
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 

    <p class="sliderTitle"> 
    Slider Title 
    </p> 
    <p class="sliderSubTitle"> 
    Slider Subtitle 
    </p> 
    <p class="sliderOverlay"> 
    Slider Overlay 
    </p> 

<script> 
function easySlider(titleP,subTitleP,overlayP){ 

    var title = titleP; 
    var subTitle = subTitleP; 
    var overlay = overlayP; 

    if(title===true) { 
    $(".sliderTitle").css("display","block"); 
    }else{ 
    $(".sliderTitle").css("display","none"); 
    } 
    if(subTitle===true) { 
    $(".sliderSubTitle").css("display","block"); 
    }else{ 
    $(".sliderSubTitle").css("display","none"); 
    } 
    if(overlay===true) { 
    $(".sliderOverlay").css("display","block"); 
    }else{ 
    $(".sliderOverlay").css("display","none"); 
    } 
} 


easySlider(true,false,false); 

https://jsfiddle.net/me2b0r56/

scheint zu funktionieren ...

+1

Das liegt daran, dass jsfiddle standardmäßig den Dokumentbereitschaftsstatus abwartet, bevor JavaScript ausgeführt wird. Bearbeiten Sie die Einstellungen, damit sie sofort in head tag ausgeführt werden und funktioniert nicht mehr: https://jsfiddle.net/me2b0r56/1/ –

0

Wenn das Ihr Code ist (und Sie wollen alle versteckt auf machen Seite laden), müssen Sie warten t er dokumentieren, bereit zu sein, bevor Sie die Funktion aufrufen:

function easySlider(titleP,subTitleP,overlayP){ 
    var title = titleP; 
    var subTitle = subTitleP; 
    var overlay = overlayP; 

    if(title===true) { 
     $(".sliderTitle").css("display","block"); 
    }else{ 
     $(".sliderTitle").css("display","none"); 
    } 

    if(subTitle===true) { 
     $(".sliderSubTitle").css("display","block"); 
    }else{ 
     $(".sliderSubTitle").css("display","none"); 
    } 

    if(overlay===true) { 
     $(".sliderOverlay").css("display","block"); 
    }else{ 
     $(".sliderOverlay").css("display","none"); 
    } 
} 

$(document).ready(function(){ 
easySlider(false,false,false); 
}); 

Andernfalls, wenn Sie die Funktion aufrufen, nachdem das Dokument geladen wird, es funktioniert gut.