如何使用xhtml在javascript中創建函數調用？

-3

這是我到目前爲止的代碼，我無法獲得執行該功能的代碼，並正確地將數據從功能輸出到「Total BMI」文本框中，我一直在尋找幾小時試圖計算它出。這是一個類的任務，我遇到了麻煩，因爲我不理解JavaScript中使用的語法來完成我需要做的一切。我的老師毫無幫助，因爲這是我們的第二項任務，從來沒有講過如何開始用Javascript編寫代碼。感謝任何人都可以提供的幫助。如何使用xhtml在javascript中創建函數調用？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>BMI Calculator</title> 
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" /> 
<link rel="stylesheet" href="BMI.css" type="text/css" /> 
<script type="text/javascript"> 
/* <![CDATA[ */ 
function calcBMI(Height, Weight) { 
    var h = parseInt(height);s 
    var w = parseInt(Wieght); 
    var TotalBMI = w * 703/(h * h); 
    document.write ("Your BMI is: " + TotalBMI) 
} 

/* ]]> */ 
</script> 

</head> 
<body> 
<h2>BMI Calculator</h2> 
<form action="" name="BMI"> 
<table border="1"> 
<tr><td>Height :(in)</td><td><input type="text" name="Height" value="" /></td></tr> 
<tr><td>Weight :(lbs)</td><td><input type="text" name="Weight" value="" /></td></tr> 
<tr><td><input type = "button" value = "Calculate" onclick = "calcBMI('Height', 'Weight')"></td></tr> 
<tr><td>Total BMI:</td><td><input type="text" name="TotalBMI" value="" /></td></tr> 
</table> 
</form> 
</body> 
</html>

來源

2014-09-12 Phibermatrix

'「 - // W3C // DTD XHTML 1.1 Strict // EN」'不是真正的公共標識符。你可能想檢查規格。 – Quentin 2014-09-12 17:44:28

無法執行您的JavaScript功能。是因爲行：**'var h = parseInt（height）; s' **爲什麼在''後面有's''？這是一個錯字嗎？你也可以傳遞參數來作爲**'（Height，Weight）** **並且可以像** ** height **，**'Wieght ** **一樣訪問它們。這真的很糟糕。 – 2014-09-12 17:45:25

你有什麼特定的問題？你看過你的瀏覽器的JavaScript控制檯嗎？有沒有錯誤？ – Quentin 2014-09-12 17:45:35

首先，在此讓我們來看一下：這裏

onclick = "calcBMI('Height', 'Weight')"

你傳遞字符串，其中不能轉換爲整數（至少不是你期待的類型）。看起來你想要得到名稱爲Height和Width的元素值。那麼這是id的name之外的一個很好的用法。

<tr><td>Height :(in)</td><td><input type="text" id="Height" value="" /></td></tr> 
<tr><td>Weight :(lbs)</td><td><input type="text" id="Weight" value="" /></td></tr> 
... 
<tr><td>Total BMI:</td><td><input type="text" id="TotalBMI" value="" /></td></tr>

現在不需要爲calcBMI()功能的任何參數，因爲我們可以直接讓他們像這樣：

document.getElementById("Height").value;

因此，這裏是改變你的函數：

function calcBMI() { 
    var h = parseInt(document.getElementById("Height").value); 
    var w = parseInt(document.getElementById("Weight").value); 
    var TotalBMI = w * 703/(h * h); 
    document.getElementById("TotalBMI").value = "Your BMI is: " + TotalBMI; 
}

注意我將document.write()更改爲.innerHTML。因爲在加載頁面之後運行document.write()重寫了DOM。

另請注意，提交<form>將刷新您的頁面。它並沒有出現，你真的需要<form>，所以我建議只刪除它。要麼是要麼阻止默認頁面刷新的行爲。

來源

2014-09-12 17:53:12

我喜歡我們的思維過程/教學風格是完全一樣的，哈哈。「首先，我們來看看這個。」「在這裏，」（我知道你沒有看到我寫了你的答案。） – 2014-09-12 17:54:59

@AndrewCheong哈哈！是的，我知道:) – 2014-09-12 17:56:08

非常感謝你們，我在控制檯的代碼行14上得到了另一個錯誤。所以我看着它是什麼引用TotalBMI然後我意識到我需要爲此設置一個id而不是名稱。 – Phibermatrix 2014-09-12 18:01:35

這裏，

onclick = "calcBMI('Height', 'Weight')"

你傳遞的字符串'Height'和'Weight'，雖然你的意思是通過相關字段的值。形式不工作的方式，所以不是你應該得到完全擺脫了參數，

onclick = "calcBMI()"

，並在功能，使用DOM遍歷得到你需要的值。首先，向您感興趣的字段添加一些id屬性，例如

<tr><td>Height :(in)</td><td><input type="text" name="Height" value="" id="height" /></td></tr> 
<tr><td>Weight :(lbs)</td><td><input type="text" name="Weight" value="" id="width" /></td></tr>

然後讓它們的價值，像這樣：

function calcBMI() { 
    var h = parseInt(document.getElementById('height').value); 
    var w = parseInt(document.getElementById('weight').value); 
    var TotalBMI = w * 703/(h * h); 
    document.write ("Your BMI is: " + TotalBMI) 
}

來源

2014-09-12 17:49:26

給別人的提示：顯然，有更好的方法，jQuery使這個微不足道，但大概這裏的目標是讓OP學習Javascript，所以我只是想爲他或她的基本錯誤帶來光明，並引導他或她到下一步。 – 2014-09-12 17:50:36

所以用JavaScript我不必定義我的函數原型與我將傳遞給它的變量？ – Phibermatrix 2014-09-12 17:54:36

如果你來自C++背景，那麼_would_看起來會很好。它在組織上是有道理的，說：「表單_發送它的值到這個Javascript函數。」然而，問題在於表單並沒有真正「知道」關於它自己的任何東西 - 通常是一個''觸發_browser_功能，爲HTTP POST發送表單數據。表單不是爲了「提交」Javascript功能而設計的。所以想想這裏的Javascript，幾乎就像一個黑客（雖然不是）。從這個角度來看，將整個HTML文檔看作是一個「全局」變量/環境;所以你可以做 – 2014-09-12 17:58:03

如何使用xhtml在javascript中創建函數調用？

回答

相關問題