web-dev-qa-db-ja.com

モデル値に応じてdiv要素を非表示にする方法は? MVC

ここに私が今持っているものがあります

 hidden="@(Model.IsOwnedByUser||!Model.CanEdit)"

これはChromeでは正常に動作しますが、Internet Explorerでは非表示になりません

また、可視性をfalseに設定しましたが、運はありませんでした。

次に、以下のような別のスタイルを見つけました

style="@(Model.IsOwnedByUser||!Model.CanEdit)?'display:none'""

うまく動かせませんでした。 Razor構文で要素を非表示にする正しい形式は何ですか?

または、Jqueryを使用して要素を非表示にします。しかし、実際にはページの読み込み時に要素を隠すjqueryステートメントを印刷することは可能ですか?

41
akd

以下のコードは、モデルのCanEditプロパティ値に基づいて異なるCSSクラスを適用する必要があります。

<div class="@(Model.CanEdit?"visible-item":"hidden-item")">Some links</div>

ただし、リンクの編集/削除などの重要なものであれば、ブラウザでcssクラス/ HTMLマークアップを更新して重要なリンクにアクセスできるため、単純に非表示にしないでください。代わりに、単純にレンダリングではなくブラウザにとって重要なものにする必要があります。

@if(Model.CanEdit)
{
  <div>Edit/Delete link goes here</div>
}
87
Shyju

試してください:

<div style="@(Model.booleanVariable ? "display:block" : "display:none")">Some links</div>

「表示」スタイル属性をboolモデル属性とともに使用して、divの可視性を定義します。

28
Yuri

IE v11より前 のバージョンでは隠し属性がサポートされていないため、コードは機能していません

バージョン11より前にIEをサポートする必要がある場合は、非表示属性が存在する場合に非表示にするCSSスタイルを追加します。

*[hidden] { display: none; }
3
kristianp