MVC JavaScript代码不起作用

我在试着做邮箱。代码我想隐藏我的邮件我收到邮件显示的所有细节，但没有工作

显示/隐藏类id='Detay'

Nuget Package=MimeKit

表演部分

点击javascript我想隐藏的数据端是一样的

 <span onclick="Goster()" class="sender" data-id="@item.MessageId" title="@item.From">@item.From </span>

@item.From

这是为了隐藏

   <div id="Detay" data-id="@item.MessageId" style="display: none">

隐藏按钮

<div class="messagebar-item-left">
                                                                            <a onclick="Gizle()" href="#" class="btn-back-message-list">
                                                                                <i class="ace-icon fa fa-arrow-left bigger-110 middle blue"></i>
                                                                                <b onclick="Gizle" class="middle bigger-110">Geri</b>
                                                                            </a>
                                                                        </div>

javascript代码

<script type="text/javascript">
    function Gizle() {
        var divObject = document.getElementById('Detay');
        divObject.style.display = 'none';
    }
    function Goster() {
        var divObject = document.getElementById('Detay');
        divObject.style.display = 'block';
    }

</script>

函数Gizle（）{
var divObject=document.getElementById（'Detay'）；
divObject.style.display='none'；
}
函数Goster（）{
var divObject=document.getElementById（'Detay'）；
divObject.style.display='block'；
}

每个html元素必须具有唯一的id， 在您的代码中，您正在为foreach循环中的多个div元素分配相同的id！例如，您必须通过添加一个数字使其唯一

<!--Show / Hidden to be part-->
<div id="Detay@(item.MessageId)" style="display: none">

当您调用show/hide时，您可以像下面这样解析id：

<span onclick="Goster('Detay@(item.MessageId)')" class="sender" title="@item.From">@item.From </span>

@item.From

要隐藏，请使用以下命令：

<b onclick="Gizle('Detay@(item.MessageId)')" class="bigger-110 middle">Geri</b>

Geri

最后，您必须修改javascript以接受id参数：

<script type="text/javascript">
    function Gizle(id) {
        $('#'+id).toggle(false);
    }

    function Goster(id) {
        $('#' + id).toggle(true);
   }
</script>

功能小控件（id）{
$（'#'+id）.toggle（false）；
}
函数Goster（id）{
$（'#'+id）.toggle（true）；
}

[更新] 完整解决方案：

    <div class="main-content">
    <div class="main-content-inner">
<div class="breadcrumbs ace-save-state" id="breadcrumbs">
<ul class="breadcrumb">
<li>
<i class="ace-icon fa fa-home home-icon">@Html.ActionLink("Ana Sayfa", "Index", "Home")</i>
</li>
<li class="active">Mail Kutusu</li>
</ul><!-- /.breadcrumb -->

</div>
<div class="page-content">

<div class="row">
<div class="col-xs-12">
<!-- PAGE CONTENT BEGINS -->
<div class="col-xs-12">
<div class="tabbable">
<ul id="inbox-tabs" class="inbox-tabs nav nav-tabs padding-16 tab-size-bigger tab-space-1">
<li class="active">
<a data-toggle="tab" href="#inbox" data-target="inbox">
<i class="blue ace-icon fa fa-inbox bigger-130"></i>
<span class="bigger-110">Gelen Kutusu</span>
</a>
</li>

<li>
<a data-toggle="tab" href="#sent" data-target="sent">
<i class="orange ace-icon fa fa-location-arrow bigger-130"></i>
<span class="bigger-110">Sent</span>
</a>
</li>
</ul>

<div class="tab-content no-border no-padding">
<div id="inbox" class="tab-pane in active">
<div class="message-container">
<div class="message-navbar clearfix">
<div class="message-bar">
<div class="message-infobar" id="id-message-infobar">
<span class="blue bigger-150">Mesaj Kutusu</span>
</div>

</div>
</div>

<div class="message-list-container">
<div class="message-list">
<!--<div class="message-item message-unread"> okunmamış-->
@foreach (var item in client.OrderByDescending(p => p.Date))
{
<div class="message-item">
<label class="inline">
<span class="lbl"></span>
</label>
<!--Show/Hidden Click-->
<span onclick="Goster('detay@(item.MessageId)')" class="sender" title="@item.From">@item.From </span>
<span class="time">@mvcHelper.saatAyarla(item.Date)</span>
@if (item.Attachments.Any())
{
<span class="attachment">
<i class="ace-icon fa fa-paperclip"></i>
</span>
}
<span class="summary">
<span onclick="Goster('detay@(item.MessageId)')" class="text">
@item.Subject
</span>
</span>
</div>

<!--Show / Hidden to be part-->
<div id="detay@(item.MessageId)" style="display: none">
<div class="message-container">
<div id="id-message-list-navbar" class="message-navbar clearfix hide">
<div>

<div class="messagebar-item-right">
<div class="inline position-relative">
<a href="#" data-toggle="dropdown" class="dropdown-toggle">
Sort &nbsp;
<i class="ace-icon fa fa-caret-down bigger-125"></i>
</a>
<ul class="dropdown-menu dropdown-lighter dropdown-menu-right dropdown-100">
<li>
<a href="#">
<i class="ace-icon fa fa-check green"></i>
Date
</a>
</li>
<li>
<a href="#">
<i class="ace-icon fa fa-check invisible"></i>
From
</a>
</li>
<li>
<a href="#">
<i class="ace-icon fa fa-check invisible"></i>
Subject
</a>
</li>
</ul>
</div>
</div>
</div>
</div>


<div id="id-message-item-navbar" class="message-navbar clearfix">
<div class="message-bar">

</div>
<div>
<div class="messagebar-item-left">
<a href="#" class="btn-back-message-list">
<i class="ace-icon fa fa-arrow-left blue bigger-110 middle"></i>
<b onclick="Gizle('detay@(item.MessageId)')" class="bigger-110 middle">Geri</b>
</a>
</div>
<div class="messagebar-item-right">
<i class="ace-icon fa fa-clock-o bigger-110 orange"></i>
<span class="grey">@mvcHelper.saatAyarla(item.Date)</span>
</div>
</div>
</div>
<div id="id-message-new-navbar" class="hide message-navbar clearfix">
<div>
<div class="messagebar-item-left">
<a onclick="Gizle()" href="#" class="btn-back-message-list">
<i class="ace-icon fa fa-arrow-left bigger-110 middle blue"></i>
<b onclick="Gizle" class="middle bigger-110">Geri</b>
</a>
</div>
</div>
</div>
<div class="message-list-container">
<div class="message-list hide" id="message-list"></div>
<div class="message-content" id="id-message-content">
<div class="message-header clearfix">
<div class="pull-left">
<span class="blue bigger-125"> @item.Subject </span>
<div class="space-4"></div>
<i class="ace-icon fa fa-star orange2"></i>
&nbsp;
<img class="middle" alt="John's Avatar" src="/Areas/admin/Content/images/avatars/avatar.png" width="32">
&nbsp;
<a href="#" class="sender">@item.From</a>
&nbsp;
<i class="ace-icon fa fa-clock-o bigger-110 orange middle"></i>
<span class="time grey">@mvcHelper.saatGoster(item.Date)</span>
</div>

</div>
<div class="hr hr-double"></div>
<div style="position: relative;" class="message-body ace-scroll">
<div style="display: block; height: 150px;" class="scroll-track scroll-visible scroll-active">
<div style="height: 127px; top: 0px;" class="scroll-bar"></div>
</div>
<div style="max-height: 150px;" class="scroll-content">
<p>

@item.GetTextBody(TextFormat.Plain)

</p>
</div>
</div>
<div class="hr hr-double"></div>

@if (item.Attachments.Any())
{
<div class="message-attachment clearfix">
<div class="attachment-title">
<span class="blue bolder bigger-110">Ekler</span>
&nbsp;
<span class="grey">@item.Attachments.Count()</span>
<div class="inline position-relative">
<a href="#" data-toggle="dropdown" class="dropdown-toggle">
&nbsp;
<i class="ace-icon fa fa-caret-down bigger-125 middle"></i>
</a>
<ul class="dropdown-menu dropdown-lighter">
<li>
<a href="#">Download all as zip</a>
</li>
<li>
<a href="#">Display in slideshow</a>
</li>
</ul>
</div>
</div>
&nbsp;
<ul class="attachment-list pull-left list-unstyled">
@foreach (var attachment in item.Attachments)
{
<li>
<a href="#" class="attached-file">
<i class="ace-icon fa fa-file-o bigger-110"></i>
<span class="attached-name">@mvcHelper.getAttachmentName(attachment.ToString())</span>
</a>
<span class="action-buttons">
<a href="#">
<i class="ace-icon fa fa-download bigger-125 blue"></i>
</a>
<a href="#">
<i class="ace-icon fa fa-trash-o bigger-125 red"></i>
</a>
</span>
</li>

}
</ul>
</div>
}
</div>
</div>
</div>
</div>

}



<!--ForEach End-->
</div>
</div>


<div class="message-footer clearfix">

<div class="pull-left"> Total</div>

<div class="pull-right">
<div class="inline middle"> page 1 of 16 </div>

&nbsp; &nbsp;
<ul class="pagination middle">
<li class="disabled">
<span>
<i class="ace-icon fa fa-step-backward middle"></i>
</span>
</li>

<li class="disabled">
<span>
<i class="ace-icon fa fa-caret-left bigger-140 middle"></i>
</span>
</li>

<li>
<span>
<input value="1" maxlength="3" type="text">
</span>
</li>

<li>
<a href="#">
<i class="ace-icon fa fa-caret-right bigger-140 middle"></i>
</a>
</li>

<li>
<a href="#">
<i class="ace-icon fa fa-step-forward middle"></i>
</a>
</li>
</ul>
</div>
</div>

<div class="hide message-footer message-footer-style2 clearfix">
<div class="pull-left"> </div>

<div class="pull-right">
<div class="inline middle"> </div>

&nbsp; &nbsp;
<ul class="pagination middle">
<li class="disabled">
<span>
<i class="ace-icon fa fa-angle-left bigger-150"></i>
</span>
</li>

<li>
<a href="#">
<i class="ace-icon fa fa-angle-right bigger-150"></i>
</a>
</li>
</ul>
</div>
</div>



</div>
</div>
</div><!-- /.tab-content -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<script type="text/javascript">
function Gizle(detayId) {
$('#'+detayId).toggle(false);
}
function Goster(detayId) {
$('#'+detayId).toggle(true); }

</script>

@ActionLink（“anasayfa”，“Index”，“Home”）

邮件库图苏







梅萨杰库图苏
@foreach（client.OrderByDescending（p=>p.Date）中的var项）
{
@项目。从
@mvcHelper.saatAyarla（项目日期）
@if（item.Attachments.Any（））
{
}
@项目.主题








@mvcHelper.saatAyarla（项目日期）
@项目.主题
@mvcHelper.saatGoster（项目日期）

@item.GetTextBody（TextFormat.Plain）

@if（item.Attachments.Any（））
{
埃克勒
@item.Attachments.Count（）







@foreach（项目附件中的var附件）
{


}

}
}
全部的
第1页，共16页


















功能小控件（detayId）{
$（'#'+detayId）.toggle（false）；
}
函数Goster（detayId）{
$（'#'+detayId）.toggle（true）；}

如果您需要土耳其解释，请通知我：）sayfa içinder id tek olmalı，foreach döngüsüiçinde aynıid'yi birçok div elemanına veriyorsun（Detay），onun için id'leri farklılaıtırmak içDetay'n sonuna Mesa id's ekleyebilirsin，Kodelarıyukarıyukim da Verdinas，艾尔卡·戈斯特/gizle Fonksiyonuçağrırken ilgili div'sini yine kodlarda verdiğim gibiğağrman lazım。kolay gelsin:）teşekküller farkına varıp değiştirdim kodları‘数据id’içerisine aldım onunla sadece ilk mesajıokuyabildim。sizin göndedim lakinçalışmadı。sizi uğraştırıyorum kusura bakmayın lakin hiçbir tepki vermiyor.：（别担心：）jQuery eklemeyi unutma