在我的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);
} })
结果是,段落在每次重新加载后返回隐藏。我想当我点击按钮,段落变得不隐藏,即使在重新加载。
谢谢
发布于 2018-12-05 09: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>
发布于 2018-12-05 09:07:56
if (show = 'true')
这不是比较,而是将"show“的值设置为"true”。使用==比较值。
发布于 2018-12-05 09:39:44
尝试使用jQuery的支柱()方法而不是attr()
,如下所示:
$("p1").prop("hidden", false);
用于jQuery的prop()
文档描述了这两种方法之间的区别,特别是对于hidden
这样的布尔属性。另外,这里有一篇关于这个.prop() vs.attr()的文章
https://stackoverflow.com/questions/53637204
复制相似问题