使用提交的數字作爲變量？

我需要幫助瞭解如何解決此問題。使用提交的數字作爲變量？

<p> Enter a number in the box. </p> 

<div> 
    <label for ="numberSubmitted"> Number: </label> 
    <input type="text" class="numberSubmitted">  
    <input type = "submit" value="Submit"> 
</div> 

<div> 
    <p class="message"></p> 
</div> 

var numberSubmitted = Number(numberSubmitted.value); 
var message = document.querySelector(".message"); 

if(numberSubmitted > 100) { 
message.textContent = "You won!"; 
} else { 
message.textContent = "You lose!"; 
}

發生了什麼是「你失去了！」被打印出來，如果我離開這個變量作爲

var numberSubmitted = Number()

如果將其更改爲

var numberSubmitted = Number(numberSubmitted.value)

代碼是行不通的。

我沒有在網上看到任何指南，告訴你如何在類中使用Number（）。任何人都可以請指出什麼時候在定義Number方法時包含類的方向嗎？

來源

2016-09-30 nrmgy

使用F12開發人員工具（特別是控制檯），您應該看到問題。如果你不清楚，然後console.log（numberSubmitted.value）並檢查F12控制檯。 –

P.S.另一個提示：JavaScript需要在腳本標籤內。這不是你的全部問題，但它是一個開始。 –

因此，有幾件事情：

的「爲」，在標籤需要指向一個id，不是一類。
當您嘗試將numberSubmitted.value放入Number（）時，您的問題不起作用，那就是numberSubmitted是未定義的，要解決此問題，您需要獲取輸入框的html元素，然後執行.value。
您需要將JavaScript放入腳本標記中。

嘗試以下操作：

<p> Enter a number in the box. </p> 

<div> 
    <label for="numberSubmitted"> Number: </label> 
    <input type="text" id="numberSubmitted"> 
    <input type = "submit" value="Submit" onclick="submit()"> 
</div> 

<div> 
    <p class="message"></p> 
</div> 

<script> 
function submit() { 
    var numberSubmitted = Number(document.getElementById('numberSubmitted').value); 
    var message = document.querySelector(".message"); 

    if(numberSubmitted > 100) { 
    message.textContent = "You won!"; 
    } else { 
    message.textContent = "You lose!"; 
    } 
} 
</script>

來源

2016-09-30 18:17:57

上面的代碼工作完美。謝謝。 – nrmgy

這裏的另一種選擇，使用事件偵聽器，而不是內聯函數調用的：

JS Fiddle Demo here。

HTML

<p> Enter a number in the box. </p> 

<div> 
    <label for="numberSubmitted"> Number: </label> 
    <input type="text" id="numberSubmitted"> 
    <input type="button" id="myBtn" value="Submit"> 
</div> 

<div> 
    <p class="message"></p> 
</div>

//bind the listener to the button 
document.getElementById('myBtn').addEventListener('click', myFunction); 
//get the input element 
var el = document.getElementById('numberSubmitted'); 

function myFunction() { 
    var numberSubmitted = Number(el.value); 
    //for debug 
    console.log(numberSubmitted); 
    var message = document.querySelector(".message"); 
    if (isNaN(numberSubmitted)) { 
    message.textContent = "That isn't a number."; 
    return; 
    } 
    if (numberSubmitted > 100) { 
    message.textContent = "You won!"; 
    } else { 
    message.textContent = "You lose!"; 
    } 
}

正如我在評論前面提到的，你需要用你的JS腳本標籤。我在上面的代碼段中做了其他評論。您會注意到，將原始JS包裝在腳本標記中是不夠的 - 仍然存在與numberSubmitted元素有關的「未定義」錯誤。這是因爲JS不知道numberSubmitted是什麼 - 您需要在DOM中查找元素並將其分配給一個變量。我已經向你展示瞭如何做到這一點。

來源

2016-09-30 18:29:02

我有腳本標籤，但我把它們拿出來以節省空間，但我明白。 – nrmgy

使用提交的數字作爲變量？

回答

相關問題