如何使用jQuery更改<span>标签</ span>之间的值?

Roxy'Pro

我正在使用小型ASP.NET MVC应用程序,该应用程序为登录的用户实现收件箱,如果用户有2条未读邮件,则带有字母和数字的图标将显示有多少条邮件标记为“未读”。

这是它的外观: 在此处输入图片说明

这是使代码看起来像上图的代码:

<i class="fa fa-envelope-o"></i>
   @if (LoggedInUser != null)
   {
           int unReadMessages = Controller.GetNumberOfUnreadMessages(LoggedInUser.LoggedInUserID);
           if (unReadMessages > 0)
           {
             <span class="badge bg-green">@unReadMessages</span>
           }
           else
           {
              <span class="badge bg-green">@unReadMessages</span>
           }

    }

接下来我在上面的代码中所做的是:

检查用户是否登录系统:

@if (LoggedInUser != null)

如果是,则从数据库中获取消息(有一个计数查询,它计算有多少条消息被标记为未读,因为我只需要在此处输入数字即可在用户登录时显示该消息)。

int unReadMessages = Controller.GetNumberOfUnreadMessages(LoggedInUser.LoggedInUserID);

在另一种视图上,我有未读消息的列表,当我单击其中任何一个时,我希望将此数字减少一个(类似unreadMessages--;

这是我的javascript方法,单击未读消息并将其状态更改为“已读”数据库:

<script type="text/javascript">

        function onSelectMessage(el) {
            $.ajax({
                method: "GET",
                url: "Message/MarkMessageAsRead",
                data: { messageID: el.id }
            })
    .done(function (response) {
        $('#email-subject').text(response.subject);
        $('#email-body').text(response.body);
        $('#email-date').text(response.created);
        $('#email-sender').text(response.sender);

        var unread = el.getAttribute('data-unread');
        UpdateMessageStatus(el.id, unread);

    });
        }

我曾尝试迄今DESRIBED在下面的代码:我添加ID到span被称为inboxMessages,它看起来是这样的:

<span class="badge bg-green" id="inboxMessages">@unreadMessages</span>

之后,我添加了这一行代码,希望能减少该字母的数字,但不幸的是,我失败了,并且我在控制台中看到我将unReadMessageCounter的值设置为NaN

var unReadMessageCounter = parseInt($('inboxMessages')); --unReadMessageCounter;

伙计们,我想知道如何从我的字母中获取这个数字(在本例中为:2个值之间<span class="badge bg-green">),@ unreadMessages(在此javascript方法中),因此我可以在一个步骤中在数据库上对其进行更新以将其标记为阅读,我可以减少字母上显示的这个数字吗?因此,当用户调用onSelectMessagejavascript方法时,我可以获得这个整数变量,该整数变量显示了我的数字,我可以减小它。

谢谢大家的欢呼

pacify21

根据是否存在未读邮件,我在生成的html中看不到任何区别,但这是我的建议:

为跨度指定唯一的ID或类值,以便可以轻松选择它。像这样:

<span id="unreadMessageBadge" class="badge bg-green">...</span>

然后,您将获得内容,对其进行解析并设置一个新值。像这样:

var msgCount = $("#unreadMessageBadge").text();

if (msgCount !== "") {
    msgCount = parseInt(msgCount) - 1;
}
if (msgCount > 0) {
    $("#unreadMessageBadge").text(msgCount);
} else {
    $("#unreadMessageBadge").hide();
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章