入力に変数を表示

入力/テキストボックスに変数値を表示するのに問題があります。可変金は、毎秒更新されてから入力に表示したいものですが、問題があります。私は少し不明瞭だ場合、HTML though..Sorryにテキストとして表示する。..入力に変数を表示

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title>Money System</title> 
 
\t 
 
\t \t <div id="gold"></div> 
 
\t \t <div id="goldpersecond"></div> 
 
\t \t <div id="lvl"></div> 
 
\t <script> 
 
\t 
 
\t \t var gold = 0; 
 
\t \t var goldpersecond = 0; 
 
\t \t var lvl = 1; 
 
\t \t //end of variables list 
 
\t 
 
\t \t function lvlup(){ 
 
\t \t \t lvl = lvl + 1; 
 
\t \t \t goldpersecond = lvl - 1; 
 
\t \t \t \t if (goldpersecond >= 1){ 
 
\t \t \t \t \t window.setInterval(
 
\t \t \t \t \t function() { 
 
\t \t \t \t \t gold = gold + goldpersecond; 
 
\t \t \t \t \t document.getElementById("gold").innerHTML = "You have " + gold + " gold!"; 
 
\t \t \t \t \t }, 1000); 
 
\t \t \t \t \t document.getElementById("lvl").value = lvl; 
 
\t \t \t \t \t \t \t \t \t } 
 
\t \t \t \t \t \t \t } 
 
\t </script> 
 
</head> 
 
<body> 
 
\t <input type="text" value="Level" disabled name="test"> 
 
\t <input type="text" value="0" id="lvl" readonly/> 
 
\t <br> 
 
\t <input type="text" value="Gold" disabled name="test"></input> 
 
\t <input type="text" value="0" id="Gold" readonly/> 
 
\t <br> 
 
\t <button type="button" onClick= "lvlup()" />Level Up!</button> 
 
</body> 
 
</html>

出典

2016-04-12 ChromeEagle

bodyからの入力ではなく、 'head'で定義された 'div'を参照しています。

は頭の中 'のdiv' 要素を取り除くと、それは

がhttps://jsfiddle.net/vdgzs1db/1/

<!DOCTYPE html> 
<html> 
<head> 
    <title>Money System</title> 
    <script> 

     var gold = 0; 
     var goldpersecond = 0; 
     var lvl = 0; 
     //end of variables list 

     function lvlup(){ 
      lvl = lvl + 1; 
     document.getElementById("lvl").value = lvl; 
      goldpersecond = lvl - 1; 
       if (goldpersecond >= 1){ 
        window.setInterval(
        function() { 
        gold = gold + goldpersecond; 
        document.getElementById("gold").innerHTML = "You have " + gold + " gold!"; 
        }, 1000); 
     } 
    } 
    </script> 
</head> 
<body> 
    <input type="text" value="Level" disabled name="test"> 
    <input type="text" value ="0" id="lvl"/> 
    <br> 
    <input type="text" value="Gold" disabled name="test"/> 
    <input type="text" value="0" id="Gold"/> 
    <br> 
    <button type="button" onClick= "lvlup()">Level Up!</button> 

</body>

を参照してください動作します

出典

2016-04-12 16:32:32

をあなたのフィールドが毎秒更新されている場合は、入力フィールドがに便利な場所ではありません値を表示します。通常のHTML表示要素（段落、スパンなど）を使用して、そこで更新します。入力ボックスは入力用に保管してください。

1秒ごとに上書きしてしまうと、入力ボックスから使用可能な値を入力して送信できる稀なユーザーになります。

ディスプレイを入力ボックスのように見せたい場合は、同じように見えるようにCSSスタイルを追加します。ユーザーにとって混乱するかもしれませんが、それが必要な場合は、表示要素をスタイリングすることは、入力を継続的に更新するよりも優れた解決策です。

出典

2016-04-12 16:13:26 Suncat2000

答えて

関連する問題