如何在刷新页面后保持视图更改？
如何在刷新页面后保持视图更改？
提问于 2018-12-05 16:57:29
在我的MVC应用程序中，我有一个视图，每10秒刷新一次页面。我有一些段落在视图中是隐藏的，并有一个按钮，使那些段落不隐藏。当我点击按钮使段落显示的问题，当页面在10秒内自动重新加载时，返回隐藏的段落。
这是按钮：
<button id="button">Display Internal Sequences</button>以下是这一段：
<p1 hidden style="text-align:center;font-size: 50px; padding:-25px; margin:-25px;">@Html.Label(@Model.CSLine.ModuleOrderInternalSequence > long.MinValue ? @Model.CSLine.ModuleOrderInternalSequence.ToString() : string.Empty)</p1>这是使p不隐藏的脚本：
<script>
$(document).ready(function () {
$("#button").click(function () {
$("p1").attr("hidden", false);
var show ='true';
localStorage.setItem(key, show);
});
});
</script>这是每10秒重新加载一次：
setTimeout(function () {
window.location.reload(1);
}, 10000);
$(document).ready(function() {
var show = localStorage.getItem(key);
if (show == 'true')
{
$("p1").attr("hidden", false);
} })结果是，段落在每次重新加载后返回隐藏。我想当我点击按钮，段落变得不隐藏，即使在重新加载。
谢谢
回答 3
Stack Overflow用户
回答已采纳
发布于 2018-12-05 17:47:44
试试https://jsfiddle.net/hbmk7e2L/
注意:在这种情况下，您的页面只会在 10秒钟后重新加载，并且只刷新一次。
如果希望每10秒刷新一次页面，则应该使用setInterval而不是setTimeout。
<script>
$(document).ready(function() {
// If you want the page to refresh constantly, you should use setInterval intead of setTimeout. setTimeout fires only once.
setTimeout(function () {
window.location.reload(1);
}, 10000);
$("#button").click(function() {
$("p1").attr("hidden", false);
localStorage.setItem("show_p1", true);
});
if (localStorage.getItem("show_p1") == 'true') {
$("p1").attr("hidden", false);
}
});
</script>
<p1 hidden style="text-align:center;font-size: 50px; padding:-25px; margin:-25px;">@Html.Label(@Model.CSLine.ModuleOrderInternalSequence > long.MinValue ? @Model.CSLine.ModuleOrderInternalSequence.ToString() : string.Empty)</p1>
<button id="button">Display Internal Sequences</button>Stack Overflow用户
发布于 2018-12-05 17:07:56
if (show = 'true') 这不是比较，而是将"show“的值设置为"true”。使用==比较值。
Stack Overflow用户
发布于 2018-12-05 17:39:44
尝试使用jQuery的支柱()方法而不是attr()，如下所示：
$("p1").prop("hidden", false);用于jQuery的prop()文档描述了这两种方法之间的区别，特别是对于hidden这样的布尔属性。另外，这里有一篇关于这个.prop() vs.attr()的文章
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53637204
复制相关文章
相似问题
腾讯云开发者
