jquery text()不与string比较

Question

我正在使用javascript来隐藏一些基于用户角色的列表项.

我从列表项中获取角色text().当我将$("#activeUser").text()值与字符串进行比较时,它不起作用.

我在javascript中使用的HTML Block获取列表项的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();

    }

});

但是如果我使用alert看到var testRole的值,它会打印Guest.

我尝试使用testRole.toString()/ string(testRole)方法将testRole值转换为字符串,但没有任何帮助.

请告诉我,我哪里出错了.谢谢.

Answer 1

问题似乎是你收到的价值中的额外白色空格 $("#activeUser").text()

解决方案:您必须修剪该值,然后将其用于比较:

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

要么

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

要么

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

以上任何一种都可行.

有关jQuery trim的更多信息,请访问此链接.

空白测试:
如果你想测试你是否获得了额外的空格,那么试试下面的javascript代码:

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

如果你得到"",那么你收到的价值就没有空格了.但是如果你在<之前或之后得到空格>,那么这些都是白色空间,这会破坏你的派对.