关键词：
【中文标题】如何使用 jQuery 更改 <span> 标签 </span> 之间的值？【英文标题】：How can I change the value between <span> tag </span> using jQuery? 【发布时间】：2017-05-20 17:31:56 【问题描述】：我正在开发小型 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);
);
到目前为止，我已经尝试过以下代码：
我将 id 添加到称为 inboxMessages 的 span
它看起来像这样：
<span class="badge bg-green" id="inboxMessages">@unreadMessages</span>
之后我添加了这行代码，希望能减少我在该字母上的数字，但不幸的是我失败了，我在控制台中看到我的 unReadMessageCounter 值为 NaN
var unReadMessageCounter = parseInt($('inboxMessages')); --unReadMessageCounter;
所以伙计们，我想知道如何从我的信中得到这个数字（在我的例子中，它是：<span class="badge bg-green"> 之间的 2 值），@unreadMessages 在这个 javascript 方法中，所以在一个步骤中我可以更新它一个将其标记为已读的数据库，我可以减少字母上显示的这个数字吗？所以当用户调用onSelectMessagejavascript 方法时，我可以获得这个显示我的号码的整数变量，我可以减少它。
谢谢大家 干杯
【问题讨论】：
【参考方案1】：我看不出根据是否有未读消息生成的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();
【讨论】：
如何使用 JavaScript 更改 span 元素的文本？
】如何使用JavaScript更改span元素的文本？【英文标题】：HowdoIchangethetextofaspanelementusingJavaScript?【发布时间】：2010-11-2410:25:39【问题描述】：如果我有一个span，说：<spanid="myspan">hereismytext</span>如何使用JavaScript将“hereismyte... 查看详情
使用jquery更改按钮的值
changevalueofbuttonwithjqueryHTML <buttonclass="myBtnmyBtnCTAsignIn"onclick="javascript:;"><span>Close</span></button> jQuery alert($('button.myBtn.myBtnCTA.signInspan').text()); 查看详情
使用jquery从div中的列表中包装元素集(代码片段)
我有一个很长的名单，每个名字都包含在span标签中。例： <span>YangZajicek</span> <span>DanielaAthey</span> <span>AlannaBumpers</span> <span>AudryWaldron</span> <span>AgnesWininger</span> <... 查看详情
如何使用 jQuery 为跨度设置值
】如何使用jQuery为跨度设置值【英文标题】：HowtosetavalueforaspanusingjQuery【发布时间】：2010-12-0206:44:57【问题描述】：如何使用jQuery为<span>标签设置值...例如……下面是我的<span>标签：<spanid="submittername">&l... 查看详情
如何使用jQuery选择树中的最后一个孩子？
】如何使用jQuery选择树中的最后一个孩子？【英文标题】：HowtoselectthelastchildinsidethetreeusingjQuery?【发布时间】：2019-10-0110:50:41【问题描述】：假设我有这样的结构：<divid="content"><div><span><b><i><u><span>... 查看详情
使用 jQuery 更改订单内容对象
】使用jQuery更改订单内容对象【英文标题】：changeordercontentobjectswithjQuery【发布时间】：2022-01-1800:37:59【问题描述】：我需要使用Jquery在元素\'a\'中的文本之前更改\'span\'对象的顺序。有人可以帮助我吗？<ahref="#"class="has-submenu"&... 查看详情
如何使用jquery更改模态中的文本？(代码片段)
大家好我试图用pokeapi创建一个pokedex。我的模态看起来像这样：<divclass="modalfade"id="exampleModalCenter"tabindex="-1"role="dialog"aria-labelledby="exampleModalCenterTitle"aria-hidden="true"><divclass="modal-dialogmodal-dialog-centered"role="document"><divclass="... 查看详情
如何使用 jQuery AJAX 将数组发送到 Codeigniter
】如何使用jQueryAJAX将数组发送到Codeigniter【英文标题】：HowcanIsendanarraytoCodeigniterwithjQueryAJAX【发布时间】：2020-10-2300:41:01【问题描述】：我有一系列学生的分数：<span>TeacherName:</span><inputid="teacher"type="text"><span>Co... 查看详情
如何使用jquery选择不是特定元素子元素的元素？
】如何使用jquery选择不是特定元素子元素的元素？【英文标题】：Howtoselectelementthatisn\'tachildofspecificelementusingjquery?【发布时间】：2019-05-1522:34:57【问题描述】：如何仅选择没有div.option作为父级的spans？<divclass="option"><span>... 查看详情
如何使用 jQuery 更改嵌套表 td 边框宽度？
】如何使用jQuery更改嵌套表td边框宽度？【英文标题】：HowcanIchangenestedtabletdborderwidthusingjQuery?【发布时间】：2013-05-2414:28:40【问题描述】：HTML<hr/><h1>Table-1</h1><hr/><tableclass="tb1"><tr><td>rw1</td& 查看详情
如何使用 jQuery 处理复选框的更改？
】如何使用jQuery处理复选框的更改？【英文标题】：HowtohandlechangeofcheckboxusingjQuery?【发布时间】：2012-02-2902:34:12【问题描述】：我有一些代码<inputtype="checkbox"id="chk"value="value"/><labelfor="chk">Value</label><br/><inputtyp... 查看详情
jquery中this和event.target的区别
...gt;</span></div>，单击span时，更改span的颜色。如果使用this按钮单击span，则由于事件起泡机制，div将更改颜色。但是使用event.target就不会。扩展资料：关于JQuery中this的用法举例例1：$("#btnConfirm").click(function()alert($(th... 查看详情
jQuery 如何从 <div> 中删除所有 <span> 标签？
】jQuery如何从<div>中删除所有<span>标签？【英文标题】：jQueryhowtoremoveall<span>tagsfroma<div>?【发布时间】：2012-02-1411:02:58【问题描述】：我尝试了以下两种方法，但都没有奏效：$(\'#divhtml\').remove(\'span\')$(\'#divhtml\')... 查看详情
如何使用 jQuery 正确更改单选按钮标签？
】如何使用jQuery正确更改单选按钮标签？【英文标题】：HowdoIproperlychangeradiobuttonlabelswithjQuery?【发布时间】：2020-12-1210:43:21【问题描述】：我正在使用jQuery3.5.1。我有这个HTML<form><div><inputtype="radio"id="radio0"name="choice">... 查看详情
jquery如何删除子元素
...</span><span></span><span></span></div>如何删除div下的span元素，除了第一个span，谢谢！1、删除元素和内容，可以通过jquery的remove()和empty()方法，remove()删除选择的元素和子元素，empty()只删除选中元素的子元素... 查看详情
使用 JQuery 将 <span> 拖放到段落
】使用JQuery将<span>拖放到段落【英文标题】：Draganddrop<span>toparagraphusingJQuery【发布时间】：2020-02-0113:39:21【问题描述】：我需要将<span>拖放到<p>。我的代码有效，但我有3个问题，当我通过键入某些... 查看详情
如何更改 svg (<g>) 高度？
】如何更改svg(<g>)高度？【英文标题】：Howtochangesvg(<g>)height?【发布时间】：2021-09-0107:22:22【问题描述】：如何更改g元素的高度？height=paramsdoesn\'twanttoreact我放弃了在cmets中的工作，因为svg非常大（Scene.js）/*Scaleman*/<gtr... 查看详情
如何使用 jQuery 更改 NEXT 项目的背景？
】如何使用jQuery更改NEXT项目的背景？【英文标题】：HowcanIchangethebackgroundofNEXTitemwithjQuery?【发布时间】：2013-01-1014:39:09【问题描述】：我有以下方法，但我无法使其工作。我想在鼠标悬停时删除以下li-tag的背景。我的代码：<di... 查看详情