Question

当我点击'未读'时然后消息将从我的消息列表中消失。除此之外，我想在for循环中迭代每条消息，以便每次单击Unread时都会删除它们。我正在尝试执行JavaScript删除功能，请参阅下面的内容，我将如何遍历每条消息？

<div class="tab-pane fade" id="settings-pills">
@{
if (Model.Messages.Count > 0)
{
var messageCounter = 0;
foreach (var message in Model.Messages)
{
messageCounter++;
if (messageCounter <= 5)
{
<div class="alert alert-default alert-dismissible" role="alert" style="background: rgb(233, 233, 233);">

<button class="close" aria-label="Close" type="button" data-dismiss="alert"><span aria-hidden="true">×</span></button>

未读

<p class="small"><i class="fa fa-envelope" aria-hidden="true"></i> Unread</p></div>

<p class="small"><i class="fa fa-calendar" aria-hidden="true"></i> @message.CreatedOn.ToString("dd MMM yyyy")</p>

<p class="small" style="font-weight: bold;"><i class="fa fa-info" aria-hidden="true"></i> Claim ref. @message.CaseNumber</p>

<p>@message.Message <a href="@Url.Action("Details","Enquiry" , new { id = @message.EnquityId })">More.</a></p>

</div>
}
else
{
<div class="alert alert-default alert-dismissible  message-More" role="alert" style="display:none;background: rgb(233, 233, 233);">

<button class="close" aria-label="Close" type="button" data-dismiss="alert"><span aria-hidden="true">×</span></button>

<p class="small"><i class="fa fa-calendar" aria-hidden="true"></i> @message.CreatedOn.ToString("dd MMM yyyy")</p>

<p class="small" style="font-weight: bold;"><i class="fa fa-info" aria-hidden="true"></i> Claim ref. @message.CaseNumber</p>

<p>@message.Message <a href="@Url.Action("Details","Enquiry", new { id = @message.EnquityId })">More.</a></p>
</div>

我认为需要迭代每条消息的JavaScript。

    $(".unreadmessage").click(function () {
        var messageId=$(this).data("id");

        $(this).remove();
});

Answer 1

如果您只需删除所有.alert-dismissible。执行此

$(".alert-dismissible").each(function(){
       $(this).remove();
}

Answer 2

再次阅读问题之后，我想我知道你正在努力解决的问题。您只想在用户读取后从列表中删除未读消息。这非常简单。这样做：

$(".UnreadMessage").click(function() {
    $(this).remove();
});

我快速制作了JSBin来帮助 http://jsbin.com/leneciluyu/edit?html,js,output

在JavaScript for for循环中迭代每条消息？

2 个答案: