Firefox不會驗證表單數據

以下帶有onclick按鈕的javascript簡單表單在Firefox（我有版本7）中不起作用，但在IE，Chrome和Safari中正常工作。我錯過了什麼？Firefox不會驗證表單數據

<head> 
<script type="text/javascript"> 
    function result() { 
     alert(calc.input.value); 
     } 
</script> 

</head> 
<body> 

<form name="calc" action=""> 
    <input class="cInput" type="text" name="input" size="16" /><br/> 
    <input type="button" class="cButton" name="seven" value="1" onclick="calc.input.value += '1'" /> 
    <input type="button" class="cButton" name="equal" value="=" onclick="result()" /><br/> 
</form> 
</body>

來源

2011-10-14 TomG

您必須將函數傳遞給onClick而不是一行代碼，並且您應該在標頭或外部JS文件中執行事件處理程序，而不是標記 – Tules

中有一個文本字段和帶有標題'1'和'='的兩個按鈕。當我點擊按鈕'1'時，它將'1'附加到文本字段中的文本上，同時點擊'='按鈕時它將顯示包含文本字段中文本的消息。那麼，你想要什麼？我也有'Firefox 7'。 –

@tules - onlick屬性是將由處理程序創建的函數的主體，它不需要函數表達式或聲明。關於在線處理程序沒有「不應該」。 – RobG

<script type="text/javascript"> 
    var calc; 
    function result() { 
     calc = document.forms['calc']; 
     alert(calc.input.value); 
     } 
</script>

來源

2011-10-14 00:45:48 Duniyadnd

是你的''之間和@ TomG的''有什麼區別？我看到了輸出，兩種情況都是一樣的。 –

你真的在比較document.forms ['calc'] .input和document.forms ['calc']。elements ['input']。它們都是正確的，但是「元素」也可以通過它們在表單中輸入的順序來調用。例如document.forms ['calc']。elements [2]將返回相同的結果。「元素」包含每一個表單元素，它允許你遍歷它們並進行其他更改（例如禁用所有表單元素或更改它們的CSS樣式）。 – Duniyadnd

感謝您的修復，它完美的工作！ – TomG

我缺少什麼？

您錯過了IE將元素名稱和ID添加爲全局變量。某些條件下的某些其他瀏覽器（有時需要文檔處於怪異模式）會複製該habbit，有些則不會。

因此，在IE（和其他一些）中，表格名稱calc是引用該表單的全局變量，而在其他瀏覽器中則不是。

Dunuyadnd的答案中的方法是一個強大的，跨瀏覽器的方式來獲取表單的參考。正式的訪問方法是：

document.forms['calc'];

命名錶單控件同樣可以訪問：

document.forms['calc'].elements['input'];

或

document.calc.input;

小心給控件的名稱是一樣的標籤，它是有點混亂。此外，如果有多個控件具有相同的名稱，則您將獲得一個HTML collection而不是一個元素。

您可能想要了解有關HTMLForms及其相關元素。

來源

2011-10-14 00:59:22 RobG

感謝您的解釋，這真的幫助我弄清楚爲什麼我的工作不正常。你願意在一些教育科目上交換幾封電子郵件嗎？如果是，我在[email protected]。謝謝... – TomG

Firefox不會驗證表單數據

回答

相關問題