我在页面上有一些显示“存在”或“不存在”的字词，用户可以单击这些字词在存在或不存在之间切换。
当单词设置为“不存在”时，我希望该文本为红色。
这个词代表一个布尔值，并使用以下代码在屏幕上更新：
<script type="text/javascript">
absentText = $.trim('@MyApp.Resources.MyAppResource.Absent_Text').toLowerCase();
presentText = $.trim('@MyApp.Resources.MyAppResource.Present_Text').toLowerCase();
updateAttendanceUrl = '@Url.Action("UpdateAttendance", "Attendance")';
</script>
在 MyAppResource.Absent_Text = 缺席的情况下，页面上的“缺席”一词可以很好地显示。
当我将 MyAppResource.Absent_Text 更改为阅读“缺席”时，我的页面字面上显示<span style="color:red">absent</span>
这是我的视图源示例：
<td><span style="color:red">absent</span></td>
所以不知何故，我的 < 和 > 符号被拿走了。
如何更改我的代码，以便当我的屏幕上的单词被写为“缺席”时，它是红色的？ 有没有一种更简单的方法来为屏幕上匹配“缺失”红色的任何文本着色？
作为参考，这是我页面中的其余 javascript：
var userId;
var attendanceDay;
var isPresent;
var updateAttendanceUrl;
var absentText;
var presentText;
var courseId;
$(document).ready(function (event) {
$('.attendance').live('click', function () {
userId = $(this).parents('tr').attr('id');
if (userId != '') {
attendanceDay = $(this).attr('id');
isPresent = $.trim($(this).find('span').text().toLowerCase());
courseId = $(this).parents('tbody').attr('id');
$(this).find('span').addClass('currentClass');
if (isPresent == absentText) {
UpdateAttendance(1);
} else {
UpdateAttendance(0);
}
} else {
event.preventDefault();
}
});
});
function UpdateAttendance(present) {
url = updateAttendanceUrl;
$.ajax({
type: "POST",
url: url,
data: "userId=" + userId + "&attendanceDay=" + attendanceDay + "&courseId=" + courseId + "&present=" + present,
success: function (data) {
if (isPresent == absentText) {
$('#' + userId).find('.currentClass').text(presentText).removeAttr('class');
} else {
$('#' + userId).find('.currentClass').text(absentText).removeAttr('class');
}
return true;
}
});
}