Question

我有一个脚本，每次点击按钮都需要时间，将@ gmail.com应用到最后并将其附加到定义的div标签。

问题在于，每次按下按钮时，第一行都会更改为当前时间，每次都会附加一行，并附上正确的详细信息，而且他们不会更新它只是第一行

有人可以建议一种方法来阻止第一行每次更新吗？

＆＃13;

function Time() {
     var d = new Date();
     var dd = d.getDate();
     var mm = d.getMonth() + 1; //January is 0!
     var yy = d.getFullYear().toString().substr(2, 2);
     var j = document.getElementById("demo").innerHTML = dd + "" + mm + "" + yy + "" + d.getHours() + "" + d.getMinutes() + "" + d.getSeconds() + "@gmail.com<br />";

     $(document).ready(function() {
       $("button").click(function() {
         if (dd < 10) {
           dd = '0' + dd
         }
         if (mm < 10) {
           mm = '0' + mm
         }
         $("#demo").append(j);
       });
     });

     return j;

   }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<h2>Click to generate time</h2>
    
    <button onclick="Time()">Generate</button>
    
    <div id="demo"></div>

＆＃13;

每次按下按钮，我期望发生的事情是附加以下内容：

2591695115@gmail.com
2591695116@gmail.com
2591695117@gmail.com
2591695118@gmail.com
...等

Answer 1

您正在HTML中调用Time() onclick。您不需要在jquery中再次说$("button").click。

此外，在将字符串分配给document.getElementById("demo").innerHTML时，您不需要var j。

请参阅以下代码：

＆＃13;

    
    function Time() {
     var d = new Date();
     var dd = d.getDate();
     var mm = d.getMonth() + 1; //January is 0!
     var yy = d.getFullYear().toString().substr(2, 2);
     var j = dd + "" + mm + "" + yy + "" + d.getHours() + "" + d.getMinutes() + "" + d.getSeconds() + "@gmail.com<br />";

        if (dd < 10) {
           dd = '0' + dd
         }
         if (mm < 10) {
           mm = '0' + mm
         }
         $("#demo").append(j);

     return j;

   }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<h2>Click to generate time</h2>
    
    <button onclick="Time()">Generate</button>
    
    <div id="demo"></div>

＆＃13;

Answer 2

这应该有效。问题是你的功能结构。我点击了Time()函数外部的按钮，并更改了var j以仅声明时间，而不是已经将其添加到HTML中。

此外，通过在var j语句后声明if，日期现在可以正确显示。

＆＃13;

function Time() {
     var d = new Date();
     var dd = d.getDate();
     var mm = d.getMonth() + 1; //January is 0!
     var yy = d.getFullYear().toString().substr(2, 2);

     if (dd < 10) {
        dd = '0' + dd
     }
     if (mm < 10) {
        mm = '0' + mm
     }

     var j = dd + "" + mm + "" + yy + "" + d.getHours() + "" + d.getMinutes() + "" + d.getSeconds() + "@gmail.com<br />";
     
     $("#demo").append(j);

   }

$("button").click(function() {
    Time();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<h2>Click to generate time</h2>
    
    <button>Generate</button>
    
    <div id="demo"></div>

＆＃13;

Answer 3

您只需要附加时间函数的结果。

$(document).ready(function () {
    $("button").click(function () {
        $("#demo").append(Time());
    });
});

function Time() {
    var d = new Date();
    var dd = d.getDate();
    var mm = d.getMonth() + 1; //January is 0!
    var yy = d.getFullYear().toString().substr(2, 2);
    var j = dd + "" + mm + "" + yy + "" + d.getHours() + "" + d.getMinutes() + "" + d.getSeconds() + "@gmail.com<br />";
    return j;
}

JavaScript附加到Div标签但有一些奇怪的行为

3 个答案: