jquery text（）が文字列と比較されない

Question

javascriptを使用して、ユーザーロールに基づくアイテムを非表示にしています。

私はリストアイテムのtext()から役割を得ています。文字列に対して$("#activeUser").text()の値を比較しているとき、文字列は機能していません。

私はJavaScriptを使用してリストアイテムのtext（）値を取得しています。

<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(); 

    } 

}); 

しかし、私は、アラートを使用するvar TestRoleというの値を見れば、それはユーザーレビューを表示します。

testRole.toString（）/ string（testRole）メソッドを使用してtestRole値を文字列に変換しようとしましたが、何も助けになりませんでした。

私が間違っているところを教えてください。ありがとう。

Answer 1

表示される値の空白は、$("#activeUser").text()

ソリューション： あなたが値をトリミングして、として、比較のためにそれを使用する必要があります。上記のいずれかが動作します

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

OR

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

OR

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

。

jQueryトリムの詳細はthis linkです。その後、
あなたは余分な空白を取得しているかどうかをテストしたい場合は、JavaScriptコードの下にしてみてください：

空白テストに

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

あなたが取得する場合、「」あなたはあなたの中に空白を持っていけません受け取った値。 しかし、<の後または>の前に空白がある場合、これらは空白で、あなたのパーティーを腐敗させます。

Answer 2

$.trim($("#activeUser").text()); あなたの要素に空白があるようです。

Answer 3

あなたが開始し、文字列の末尾に空白を削除する必要があります。

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

なぜここにあなたが見ることができます：問題が余分にあると思わ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

男、まずあなたはそれをしなければなりません、それは正しいセレクターです。

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

あなたは

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

を書くことができるか、あなたはこれらの要素の同じクラスを追加することができ、それは

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

と

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

OK正しいのですか？次：

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