javascript - jquery text() 不比较字符串

Question

我正在使用 javascript 根据用户 Angular 色隐藏一些列表项。

我正在从列表项的 text() 中获取 Angular 色。当我将 $("#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();

    }

});

但是如果我使用警报看到 var testRole 的值，它会打印 Guest。

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

请让我知道我哪里出错了。谢谢。

Answer 1

问题似乎是您从 $("#activeUser").text() 收到的值中有多余的空格

解决方案:您必须 trim 该值，然后将其用于比较:

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

或

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

或

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

以上任何一个都可以。

有关 jQuery trim 的更多信息，请访问 this link .

空格测试:
如果您想测试是否有多余的空格，请尝试以下 javascript 代码:

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

如果你得到 ""那么你收到的值中没有空格。但是如果你在 < 之后有空格或之前 > ，那么这些都是空白，会破坏你的派对。