訪問HTML表單值的JavaScript

這裏是我想達到的，但出於某種原因，這是行不通的：訪問HTML表單值的JavaScript

的Javascript：

<script type="text/javascript">   
    function calculate() {    
    var n1 = getElementById("1").value 
    var n2 = getElementById("2").value 
    var answer = n1+n2 
    alert(answer) 
    } 
</script>

HTML：

<form id="form"> 
<input id="1" type="text" /> 
<input id="2" type="text" /> 
<input type="button onClick="calculate()" value="Go" /> 
</form>

我不知道我錯了哪裏，有人可以幫忙嗎？

來源

2013-04-20 Sam Creamer

你不應該用數字開始ID - 在HTML4和CSS中它是isn't allowed，在HTML5中它是允許的，但這樣做不是好習慣。

另外，在此上下文中，它在HTML5中是非法的 - 作爲以數字requires at least one letter afterwards開頭的ID。

因此，首先用字母/單詞替換編號的ID。

除了這個，你需要修復下面提到的語法錯誤：

更換getElementById("id").value與document.getElementById("id").value;

，並同時更換<input type="button onClick="calculate()" value="Go" />

與<input type="button" onClick="calculate()" value="Go" />（注意有一個封閉"缺少"button"）。

這是一個工作jsFiddle。

這裏是在的jsfiddle使用的代碼：

的Javascript：

function calculate() { 
    var n1 = document.getElementById("aItem").value; 
    var n2 = document.getElementById("bItem").value; 
    var answer = n1+n2; 
    alert(answer); 
}

HTML：

<form id="form"> 
    <input id="aItem" type="text" /> 
    <input id="bItem" type="text" /> 
    <input type="button" onClick="calculate()" value="Go"/> 
</form>

來源

2013-04-20 18:41:25 lifetimes

我從來不知道這一點，非常感謝 – 2013-04-20 18:42:17

@ user125697有趣的是，現在在HTML5中允許用數字開始ID;但是，這裏的ID在CSS和HTML5中仍然是非法的 - 因爲HTML5在ID中需要「至少一個字符」：http://www.w3.org/html/wg/drafts/html/master/dom.html ＃the-id-attribute – 2013-04-20 19:25:02

@SamCreamer嘿！隨時接受我的答案，如果它有幫助（檢查這個如何做--http：//meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work），非常感謝！ – lifetimes 2013-05-25 00:41:33

HTML：

<input id="val1" type="text" value="100" /> 
<input id="val2" type="text" value="200"/> 
<input type="button" onclick="calculate()" value="Go" />

的JavaScript：

function calculate() { 
      var n1 = +(document.getElementById("val1").value); 
      var n2 = +(document.getElementById("val2").value); 
      var answer = n1+n2; 
      alert(answer); 
     }

這將增加進入，而不是串聯他們2個數值。

來源

2013-04-20 19:04:43 DaveB

訪問HTML表單值的JavaScript

回答

相關問題