jQuery 如何根据模型值隐藏 div 元素?MVC
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/22046108/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to hide a div element depending on Model value? MVC
提问by akd
Here is what I have at the moment
这是我目前所拥有的
hidden="@(Model.IsOwnedByUser||!Model.CanEdit)"
This works fine on Chrome but doesnt hide on Internet Explorer
这在 Chrome 上工作正常,但在 Internet Explorer 上不隐藏
I tried also visibility set false but no luck.
我也尝试将可见性设置为 false 但没有运气。
then I found out another style as below
然后我发现了另一种风格,如下所示
style="@(Model.IsOwnedByUser||!Model.CanEdit)?'display:none'""
I could not get it worked. What is the correct format to hide an element with Razor syntax?
我无法让它工作。使用 Razor 语法隐藏元素的正确格式是什么?
Or I would use Jquery to hide the element. but is it actually possible print out jquery statement that would hide the element on page load?
或者我会使用 Jquery 来隐藏元素。但实际上是否可以打印出在页面加载时隐藏元素的 jquery 语句?
回答by Shyju
The below code should apply different CSS classes based on your Model's CanEdit
Property value .
下面的代码应该根据您模型的CanEdit
属性值应用不同的 CSS 类。
<div class="@(Model.CanEdit?"visible-item":"hidden-item")">Some links</div>
But if it is something important like Edit/Delete links, you shouldn't be simply hiding,because people can update the css class/HTML markup in their browser and get access to your important link. Instead you should be simply not Renderingthe important stuff to the browser.
但是如果它是像编辑/删除链接这样重要的东西,你不应该简单地隐藏,因为人们可以在他们的浏览器中更新 css 类/HTML 标记并访问你的重要链接。相反,您应该简单地不将重要的内容呈现给浏览器。
@if(Model.CanEdit)
{
<div>Edit/Delete link goes here</div>
}
回答by Yuri
Try:
尝试:
<div style="@(Model.booleanVariable ? "display:block" : "display:none")">Some links</div>
Use the "Display" style attribute with your bool model attribute to define the div's visibility.
使用“显示”样式属性和 bool 模型属性来定义 div 的可见性。
回答by kristianp
Your code isn't working, because the hidden attibute is not supported in versions of IE before v11
If you need to support IE before version 11, add a CSS style to hide when the hidden attribute is present:
如果需要支持IE 11之前的版本,添加一个CSS样式,当hidden属性存在时隐藏:
*[hidden] { display: none; }