jquery text() nicht mit String zu vergleichen

Question

Ich benutze Javascript, um einige Listenelemente basierend auf der Benutzerrolle zu verbergen.

Ich bekomme die Rolle aus einem Listenelement text(). Wenn ich den $("#activeUser").text() Wert mit einer Zeichenfolge vergleiche, funktioniert es nicht.

HTML Block, den ich in meinem Javascript verwende, um den text() -Wert eines Listenelements zu erhalten.

<ul class="pull-right breadcrumb"> 
    <li><a href="index.php">Home</a> <span class="divider">/</span> </li> 
    <li id="activeUser" class="active"> <?php echo ucfirst($_SESSION['sewafs_user_role']); ?> </li> 
</ul> 

Javascript

$(document).ready(function() { 
    var testRole = $("#activeUser").text(); 

    //This block of code works 
    role = 'Guest'; 
    if (role == 'Guest') { 
     alert("Inside if"); 
     $("#request_history_li").hide(); 
     $("#assign_role_li").hide(); 
     $("#volunteer_li").hide(); 
     $("#profile_li").show(); 
     $("#change_password_li").show(); 

    } 

    //This doesn't work why? 
    if (testRole == 'Guest') { 
     alert("Inside if"); 
     $("#request_history_li").hide(); 
     $("#assign_role_li").hide(); 
     $("#volunteer_li").hide(); 
     $("#profile_li").show(); 
     $("#change_password_li").show(); 

    } 

}); 

Aber wenn ich den Wert des var Testrole mit Alarm sehen druckt er Gast.

Ich versuchte, den testRole-Wert in die Zeichenfolge mit der Methode testRole.toString()/string (testRole) zu konvertieren, aber nichts half.

Bitte lassen Sie mich wissen, wo ich falsch liege. Vielen Dank.

Answer 1

Das Problem zusätzlich zu sein scheinen Leerzeichen in dem Wert, den Sie von $("#activeUser").text()

erhalten

Lösung: Sie müssen den Wert trimmen und verwenden Sie es dann zum Vergleich als:

var testRole = $("#activeUser").text().trim(); 

ODER

var testRole = $.trim($("#activeUser").text()); 

ODER

var testRole = $("#activeUser").text(); 
testRole = $.trim(testRole); 

Jede der oben arbeiten.

Weitere Informationen über jQuery Trim bei this link.

Whitespace-Test:
Wenn Sie testen möchten, wenn Sie zusätzliche weißen Räume bekommen, versuchen Sie dann unter Javascript-Code:

alert("-" + $("#activeUser").text() + "-"); 

Wenn Sie "get" dann müssen Sie nicht Leerzeichen haben in Ihrem erhaltener Wert. Aber wenn Sie nach < oder vor > Leerzeichen erhalten, dann sind dies Leerzeichen, die Ihre Party verderben.

Answer 2

Versuchen Sie, die Zeichenfolge zu trimmen, mit $.trim($("#activeUser").text()); Es scheint in Ihrem Element Whitespaces zu sein.

Answer 3

Sie benötigen weiße Leerzeichen am Anfang und Ende der Zeichenfolge zu trimmen:

var testRole = $("#activeUser").text().replace(/^\s+|\s+$/g,''); 

Sie können sehen, warum hier: http://jsfiddle.net/AfUZR/1/

Answer 4

Demo

$(document).ready(function() { 
     var testRole = $("#activeUser").text().trim();  
     //This doesn't work why? 
     if (testRole == "Guest") { 
      alert("Inside if"); 
      $("#request_history_li").hide(); 
      $("#assign_role_li").hide(); 
      $("#volunteer_li").hide(); 
      $("#profile_li").show(); 
      $("#change_password_li").show(); 

     } 

    }); 

Answer 5

Mann, zuerst, was müssen Sie tun, es ist richtig schreiben Selektor.

$("#request_history_li").hide(); 
$("#assign_role_li").hide(); 

Sie können

schreiben

$("#request_history_li, #assign_role_li").hide(); 

oder Sie können die gleichen Klassen dieser Elemente hinzufügen, das ist richtig

<ul> 
    <li class="same_class 1"></li> 
    <li class="same_class 2"></li> 
</ul> 

und

$(".same_class").hide(); 

ok? next:

Zu Ihrem Problem, js früher geladen, als Sie die Rolle, verwenden danke

$(document).ready(function(){ 
    ...... 
});