gpt4 book ai didi

javascript - JQuery toggle() html 数据

转载 作者:太空宇宙 更新时间:2023-11-04 15:00:50 25 4
gpt4 key购买 nike

我曾尝试寻找解决方案,但似乎找不到可行的答案。我可能错过了一些明显的东西。

我有一个链接可以显示状态的最新评论。单击链接时,链接数据更改为“关闭”(一切正常),但是当单击关闭以切换 DIV 时,链接数据保持“关闭”状态,我希望它返回原始文本(即 3 条评论)。

HTML:

<a class="comments" id="coms-<?php echo $statmainID; ?>" href="javascript:;"><i class="fa fa-comment"></i> <?php echo $numComs; ?> Comments</a>

<div id="comss<?php echo $statmainID; ?>" style="display:none;">Comments Here</div>

JQuery:

$(function(){
$('body').on('click', '.comments', function(){
var cID =$(this).attr('id');
var theID = cID.split("-");
var divID = theID[1];
$('#comss'+divID).toggle("slide");
$('.comments'+divID).html('Close');
return false;
});
});

一如既往,我们非常感谢您大师的任何帮助。

亲切的问候。

最佳答案

您可以使用数据属性来存储原始文本。然后你可以再次显示它。

HTML

<body> 
<a class="comments" id="coms-1" href="javascript:;" data-id="comss1" data-text="4 Comments">
<i class="fa fa-comment"></i> 4 Comments
</a>
<div id="comss1" style="display:none;">Comments Here</div>

<a class="comments" id="coms-2" href="javascript:;" data-id="comss2" data-text="2 Comments">
<i class="fa fa-comment"></i> 2 Comments
</a>
<div id="comss2" style="display:none;">Comments Here</div>
</body>

JS

$(function(){
$('body').on('click', '.comments', function(){
var cID =$(this).attr('id');
var theID = cID.split("-");
var divID = theID[1];
$('#comss'+divID).toggle("slide");

var comments = $('#coms-'+divID);
if($(comments).text() === "Close"){
$(comments).html($(comments).data("text"));
} else {
$(comments).html('Close');
}

return false;
});
});

关于javascript - JQuery toggle() html 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34471661/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com