5

我正在使用此代码在 _Layout.cshtml 页面中显示倒数计时器。
但是当我从一个页面移动到另一个页面时,计时器会在新页面加载时再次启动。1.导航到新页面时如何在不重新启动的情况下显示计时器。
2.如何停止用户刷新页面,使计时器不再启动。

我的布局代码:

     <table width="100%">
   <tr>
   <td width="2%">
   <img src="~/Images/philips_new.png" alt="" height="45" width="155" />
   </td>
   <td width="79%" align="right" class="Text_nocolor">
   <span class="Text_nocolor">
  @{ Html.RenderAction("GetUserName", "Login");}
   </span>
  </td>
  <td width="4%">
<div id="counter">
 </div>
 </td>
 <td width="4%" class="Text_nocolor" valign="middle">
    <a href="@Url.Action("Index", "Login", new { controller = "Login" })">
 <img src="~/Images/nome-logout.png" alt="" height="24" width="30" style="border-style: none; cursor: pointer;" /></a>
  </td>
  </tr>
 </table>

我尝试使用 jquery 插件倒数计时器,但它显示对象在 IE 中不支持此属性错误。
任何建议都会有所帮助。

4

3 回答 3

0

您可以在每次回发或页面刷新时使用与服务器端代码同步的 javascript 时间。

使用以下代码

 var dt = '@ViewBag.EndDate';
var dateAr = dt.split('-');
var newDate = dateAr[1] + '/' + dateAr[0] + '/' + dateAr[2];

var end = new Date(dateAr[1] + '/' + dateAr[0] + '/' + dateAr[2]);

var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;

function showRemaining() {
   var now = new Date();
   var distance = end - now;
   if (distance &lt; 0) {
       clearInterval(timer);
       document.getElementById('countdown').innerHTML = 'EXPIRED!';
       window.location.href = '/Home/Index';

       return;
   }
var days = Math.floor(distance / _day);
var hours = Math.floor((distance % _day) / _hour);
var minutes = Math.floor((distance % _hour) / _minute);
var seconds = Math.floor((distance % _minute) / _second);


document.getElementById('countdown').innerHTML = hours + 'hrs ';
document.getElementById('countdown').innerHTML += minutes + 'mins ';
document.getElementById('countdown').innerHTML += seconds + 'secs';

}

timer = setInterval(showRemaining, 1000);

你可以关注这个链接

http://www.cshaptrick.com/2014/09/count-timer-asp-net-mvc-exams/

于 2014-09-20T11:28:46.473 回答
0

1.导航到新页面时如何在不重新启动的情况下显示计时器。您可以将计数器值存储在 cookie 中。这是

简单的方法,您可以在页面之间传递值。

2.如何停止用户刷新页面,使计时器不再启动。

如果您使用cookie来存储值,我认为这可以解决。不知道你说的这个问题是什么意思。

你的确切目标是什么?

于 2012-11-20T10:49:18.537 回答
0

使用 ajax 函数调用将在会话中存储计时器值的操作。因此,即使用户刷新页面,您仍然拥有当前值。

希望这可以帮助

于 2012-11-23T12:19:57.603 回答