ユーザ入力時にforループを出力する

私のページにforループを表示する際に問題があります。クリックすると、ユーザが数字を入力するよう促すボタンがあり、forループを介して前記数字の反復を表示する。私はここで尋ねられた類似の質問を見てきましたが、まだ問題に陥っているようです。ユーザ入力時にforループを出力する

<!doctype hmtl> 
<html> 
<head></head> 

<button onclick="getNumber()">Click!</button> 
<p id="demo"></p> 

<script> 
function getNumber() { 
    var i; 
    var num; 
    var n = prompt("Please enter a number"); 
    for(i = 0; i < n.length; i++){ 
     num += n[i]; 

     document.getElementById("demo").innerHTML += num + " "; 
    } 
} 
</script> 
</body> 
</html>

出典

2017-02-20 Leopold Stoich

FYI：<！DOCTYPE HTML>： '<！DOCTYPEのHMTL>は'にする必要がある ''とは '' タグを開口部を持っていません。これはコードが機能していない理由ではありませんが、HTMLが無効になります。 –

私はタグを先に気付き、 "html"のスペルミスが気にしないと@Scott Marcus –

を役に立てば幸い

値の代わりに値を入力したユーザーのlengthプロパティを取得しようとしました。

また、コードにいくつかの不要なビットがあり、パフォーマンスに悪影響を与えるいくつかの悪い方法があります。

// Get a reference to the HTML (DOM - Document Object Model) elements that 
 
// you will need access to at this level of scope 
 
var btn = document.getElementById("btn"); 
 

 
// Don't set up event handling code in the HTML (a.k.a. inline event handling) as it 
 
// makes the HTML harder to read (two languages on a single line), it doesn't follow 
 
// the standard for event handling, and it causes anonymous Global JavaScript functions 
 
// to be made as wrappers around the HTML attribute values. Instead, do it in JavaScript 
 
// like this: 
 
btn.addEventListener("click", getNumber); 
 

 
function getNumber() { 
 
    // Just scan for the element once, not each time the loop iterates 
 
    var el = document.getElementById("demo"); 
 

 
    // Get the user's input and convert it to a number 
 
    var n = parseInt(prompt("Please enter a number"), 10); 
 
    
 
    // Set up a string that will become the output. 
 
    var output = ""; 
 
    
 
    for(var i = 0; i < n; i++){ 
 
    // NEVER alter an HTML (DOM) element within a loop as performance suffers 
 
    // because the browser must recreate the entire DOM structure. 
 
    // Instead, set up a variable that holds the results 
 
    output += " " + i; 
 
    } 
 

 
    // Once loop is done, update element with the variable. But, this way, 
 
    // you are doing it just once, instead of each time the loop iterates. 
 
    // Also, if the new content does not include HTML, then use textContent 
 
    // instead of innerHTML as it lets the browser know that the data does 
 
    // not have to be parsed, which results in a quicker update. 
 
    el.textContent = output; 
 
}

<button id="btn">Click!</button> 
 
<p id="demo"></p>

出典

2017-02-20 22:06:05

です。しかし、完全性のために、このユーザーはJavaScriptにとって非常に新しいようです。 –

そのように安全だと同意してください！ –

それはi < nないi < n.lengthでなければなりません。何をしているのかは、変数n（途中で文字列）内に文字がある場合と同じくらい多くの回数ループしているためです。したがって、ユーザが9を入力した場合は、"9".lengthが1であり、0と1の間に反復が1つしかない（除外されている）ため、1つの数値だけが出力されます。これを試してください：あなたがしようとしているが、あなたはforループを繰り返したい場合は、ユーザーが入力を入力するまで、あなたは

チェックこのスニペットを以下のようにそれを行うことができます正確にわからない

function getNumber() { 
    var num = 0; // this should be initialized 
    var n = prompt("Please enter a number"); 
    for(var i = 0; i < n; i++){ 
     num += i; // add i 
     document.getElementById("demo").innerHTML += num + " "; 
    } 
}

出典

2017-02-20 22:05:02

numは必要ない。 –

@ScottMarcus私は彼が与えられた数字まで合計を望んでいることを理解していたので、numは必要です！ –

ああ、最初は私には分かりませんでした。いいですよ。 –

を

function getNumber() { 
 
    var i; 
 
    var num; 
 
    var n = prompt("Please enter a number"); 
 

 
    for (i = 0; i < n; i++) { 
 
    document.getElementById("demo").innerHTML += i + " "; 
 
    } 
 

 

 

 
}

<button onclick="getNumber()">Click!</button> 
 

 
<p id="demo"></p>

は、それが

出典

2017-02-20 22:05:19 Geeky

問題がn.length一部です。ユーザが数字「10」を提供すると想像してください。 10番の長さプロパティは2なので、ループ内のコードは10回ではなく2回実行されます。

<html> 
 
<head> 
 
</head> 
 

 
<button onclick="getNumber()">Click!</button> 
 

 
<p id="demo"></p> 
 

 
<script> 
 
function getNumber() { 
 
    var i; 
 
    var num; 
 
    var n = parseInt(prompt("Please enter a number")); 
 
    for(i = 1; i <= n; i++){ 
 
     document.getElementById("demo").innerHTML += " " + i; 
 

 

 
    } 
 

 

 

 
} 
 

 
</script> 
 

 
</body> 
 
</html>

出典

2017-02-20 22:09:14 bognix

ここでコードが機能しない理由がない限り、解決のために外部サイトにリンクしないでください。外部サイトに投稿する場合でも、外部リンクが将来無効になる場合には、あなたの回答は返されないように、ここにコードを投稿する必要があります。 –

修正していただきありがとうございます！私は未来のためにそれを覚えています！ – bognix

ユーザ入力時にforループを出力する

答えて

関連する問題