-1

後に時計を表示できるページを作成するように求めるタスクがありました

ユーザーがスタートボタンをクリックし、停止ボタンをクリックすると停止します

DOM1メソッドが必要なため、時計は「span」タグ内に表示する必要があります。

だから私のコードは現在このように見えます

*私はすでにこれを修正しました。

function clock()
{


var obj = document.getElementById('clock');
if (obj)
{
var now = new Date();
var mytime = now.getHours()+":"+now.getMinutes()+"."+now.getSeconds();
obj.innerHTML = mytime;

}
}




</script>

</head>

<body onload="clock()">
<table>
<h1>A live clock in JavaScript</h1>

<p>The time according to your PC is :<span id="clock"></span></p>




<input type="button" name="clickMe" value="Start the clock"
onclick="timer = setInterval(clock, 1000)"/>


<button onclick="window.clearInterval(timer)">Stop</button>
</table>
</body>
</html>
4

1 に答える 1

0 
obj.document.getElementById('clock');

objはこの時点では未定義なので、をスローしreferenceErrorます。おそらくあなたは意味しました：

var obj = document.getElementById('clock');

if (obj != "false")

文字列と比較しているため、これはおそらく機能しません。objがオブジェクトかどうかを確認したい場合nullは、

if (obj)

obj = mytime;

これは元のを変更しませんobjが、それへの参照を保持している変数を上書きします。おそらくあなたが欲しかった

obj.innerHtml = mytime;

また、HTMLをから変更します

<p id="clock">The time according to your PC is :</p>

に

<p>The time according to your PC is :<span id="clock"></span></p>

テキストを上書きせず、時計を上書きするようにします。

onclick="setTimeout('"
...
onclick="int=window.clearInterval(int)"

欠落している部分があります：

onclick="timer = setInterval(clock, 1000)"
...
onclick="window.clearInterval(timer)"

ここで、最初の引数は繰り返し呼び出される関数であり、2番目の引数はミリ秒単位の呼び出しの頻度です。また、の戻り値は、clearIntervalによって返される値である必要があるため、特に有用ではないことに注意してくださいsetInterval。

setTimeoutまた、（関数を1回呼び出す）とsetInterval（繰り返し呼び出す）の違いにも注意してください。

timerまた、変数がグローバルスコープに存在することにも注意してください。これは、大規模なプロジェクトでは問題になる可能性があります。また、タイマーを数回開始すると、今は停止できないため、問題が発生します。代わりに（最後にbody）これ​​を検討してください（そして両方の入力に正しいIDを割り当ててください）：

(function(){ //create a scope
  var timer; //create a local variable

  document.getElementById("clock-start")
  .addEventListener("click", function(){
    if(!timer) timer = setInterval(clock, 1000);
  })

  document.getElementById("clock-stop")
  .addEventListener("click", function(){
    clearInterval(clock);
  })
})() // remember to call our anonymous function

またはjQueryバージョン（ドキュメント内の任意の場所）：

$(document).ready(function(){ //execute on DOM ready
  var timer;

  $("#clock-start").on("click", function(){
    if(!timer) timer = setInterval(clock, 1000);
  })

  $("#clock-stop").on("click", function(){
    clearInterval(clock);
  })
});
于 2012-12-17T05:07:49.137 に答える