javascript jquery text() 不与字符串比较
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18396117/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery text() not comparing to string
提问by user2617611
I am using javascript to hide some list Items based on the user role.
我正在使用 javascript 根据用户角色隐藏一些列表项。
I am getting the role from a list item's text(). When I am comparing the $("#activeUser").text()value against a string, it is not working.
我从列表项的text(). 当我将$("#activeUser").text()值与字符串进行比较时，它不起作用。
HTML Block that I am using in my javascript to get the text() value of a list item.
我在我的 javascript 中使用的 HTML 块来获取列表项的 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
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();
}
});
But if I see the value of the var testRole using alert it prints Guest.
但是，如果我使用警报看到 var testRole 的值，它会打印 Guest。
I tried converting the testRole value into string using testRole.toString() / string(testRole) method, but nothing helped.
我尝试使用 testRole.toString() / string(testRole) 方法将 testRole 值转换为字符串，但没有任何帮助。
Please let me know, where I am going wrong. Thanks.
请让我知道，我哪里出错了。谢谢。
回答by Purnil Soni
The problem seems to be extra white-spaces in the value that you receive from $("#activeUser").text()
问题似乎是您收到的值中的额外空格 $("#activeUser").text()
Solution: You must trim the value and then use it for comparison as:
解决方案：您必须修剪该值，然后将其用于比较：
var testRole = $("#activeUser").text().trim();
OR
或者
var testRole = $.trim($("#activeUser").text());
OR
或者
var testRole = $("#activeUser").text();
testRole = $.trim(testRole);
Any of the above will work.
以上任何一项都将起作用。
More info on jQuery trim at this link.
有关 jQuery 修剪的更多信息，请访问此链接。
Whitespace test:
If you want to test if you are getting extra white spaces, then try below javascript code:
空格测试：
如果您想测试是否有多余的空格，请尝试以下 javascript 代码：
alert("-" + $("#activeUser").text() + "-");
If you get "" then you dont have whitespaces in your received value.
But if you get spaces after <or before >, then these are white spaces, that are spoiling your party.
如果您得到 ""，那么您收到的值中没有空格。但是，如果您在 之后<或之前>有空格，那么这些是空格，会破坏您的聚会。
回答by Dennis
Try trimming the string, with $.trim($("#activeUser").text());There seem to be whitespaces in your element.
尝试修剪字符串，$.trim($("#activeUser").text());元素中似乎有空格。
回答by user1498339
You need to trim white spaces at start and end of the string:
您需要在字符串的开头和结尾修剪空格：
var testRole = $("#activeUser").text().replace(/^\s+|\s+$/g,'');
You can see why here: http://jsfiddle.net/AfUZR/1/
你可以在这里看到原因：http: //jsfiddle.net/AfUZR/1/
回答by Prabu Parthipan
$(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();
}
});
回答by user2695808
Man, first what do you must do it, it's write correct selector.
伙计，首先你必须做什么，它是编写正确的选择器。
$("#request_history_li").hide();
$("#assign_role_li").hide();
you can write
你可以写
$("#request_history_li, #assign_role_li").hide();
or you can add the same classes of these Elements, that is correct
或者您可以添加这些元素的相同类，这是正确的
<ul>
<li class="same_class 1"></li>
<li class="same_class 2"></li>
</ul>
and
和
$(".same_class").hide();
ok? next:
好的？下一个：
As concerns your problem, js loaded earlier than you determine the role of, use
至于你的问题，js加载时间早于你确定的作用，使用
$(document).ready(function(){
......
});
