Question

我目前有以下代码显示：

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-example72-production</title>


  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
  <script scr="your-code.js"></script>


</head>
<body ng-app="myApp">
  <div ng-controller="myCtrl">
    <button ng-mouseover="alertHi()">
      Alert Hi
    </button>
  </div>
</body>
</html>

我需要将其替换为：

<h1  id="header1" class="loginhead">Welcome to the <%=formFields.getDisplayValue("programName")%> Registration Site, .</h1>

我需要在日期和时间为<h1 id="header2" class="loginhead" >The <%=formFields.getDisplayValue("programName")%> Registration Site, is now closed.</h1>

时进行替换

使用 Jquery ， JSP 或 Javascript 进行此操作的任何方式？

更新**

7/15/15 11:59PM PT

Answer 1

首先使用javascript更容易编辑你的HTML。我们将通过创建一个空的span来将封闭的消息插入到：

<h1  id="header" class="loginhead" >Welcome to the <%=formFields.getDisplayValue("programName")%> Registration Site <span id='closed'></span> </h1>

现在在您的javascript部分：

var now = new Date().getTime(); //Return the number of milliseconds since 1970/01/01:

var epochTimeJul15_1159pm = 1437019199000; // number of milliseconds since 1970/01/01 at Jul 15_11:59:59pm. See http://www.epochconverter.com/.

var timeTillChange = epochTimeJul15_1159pm - now;

function changeHeader(){
    document.getElementById('closed').innerHTML = ' is now closed.'; //change the html/text inside of the span with the id closed'.
}

setTimeout(changeHeader, timeTillChange); //will wait to call changeHeader function until timeTillChange milliseconds have occured.

一旦时钟到达11:59:59，这将使标题立即被编辑。

Answer 2

if ($.now >= dateLimit){
    $("#header1").hide(0);
    $("#header2").show(0);
}

这将是一种通用的jquery方法，您可以设置隐藏的两个元素或相应地显示在您的CSS中。

这会在页面加载时执行，我不确定如何实现此动态版本。

Answer 3

这是如何使用JavaScript动态完成的。 Working Plunker

您只需比较两个date并更改innerHTML的{{1}}。

header

根据日期比较更改innerHTML

3 个答案: