JavaScript <form>輸入字段“associative”數組？

Question

我首先要說明我完全清楚JavaScript中沒有“真正的”關聯數組。 話雖這么說，我希望有類似......

<form action="javascript:submitSpecial();" name="myForm" >
    <input name="myInput" type="text" />
</form>

具體來說，我不希望此表單直接調用.php腳本。 我希望它由我的JavaScript函數“submitSpecial（）”處理，並用各自的名稱選擇表單輸入，並對下一個.php腳本進行AJAX調用。

document.forms['myForm']['myInput'].name
document.forms['myForm']['myInput'].value

基本上我想在其中構建或查找包含此信息的數組。 我只能使用JavaScript，沒有JQuery或類似的東西。 elements []集合非常接近，但我需要知道屬於這些值的列名。

有什么建議？

先謝謝你，扎克

Answer 1

我不明白你的困難。 看起來您了解如何獲取Javascript表單元素 。 如果沒有，請查看鏈接。 以下是如何在表單中獲取元素 。

如果需要鍵值對，請創建一個JSON對象。 這是技術概述 。 這是一個可愛的例子 。

...所以，在你的用例中：

var formStuffy = {
   "formName" : [
       { "formElementName" : document.getElementByName(formElementName).value },
   ]
}

或類似的東西（沒有測試那個片段，但在概念上它應該在球場。）

編輯：根據操作說明，他希望自動獲取表單字段的值，您可以使用這樣的元素來查詢表單的命名元素和值：

for (i=0; i<theform.elements.length; i++){
  alert("element name is " + theform.elements[i].name + " value " + theform.elements[i].value);
}

Answer 2

我不確定我是否正確理解你的問題，我通常建議不要使用古代（1996年代）的forms.elements.blah語法，但forms.elements.blah再次，如果它適用於你目前的情況，那就去吧。

如果我正確地解釋了您的問題，那么您有一個包含許多字段的表單，如果它們存儲在關系數據庫中，則表示通過在該數據庫中的表或視圖中顯示多個行而形成的列。 在天真實現的情況下，這將導致在表單中存在許多相同名稱的字段的情況。 這不一定是壞事，並且實際上需要這樣的情況作為允許多個選擇的一組復選框。 但是，在這些明確定義的案例之外，應盡可能避免這種情況。

無論如何，拋開更重要的問題，讓我們假設一個具有以下結構的表格：

<form name="banana" action="bananaform">
    <input name="skin">
    <input name="skin">
    <input name="skin">
</form>

此標記將生成一個表單，其中包含三個文本輸入，每個輸入名為“skin”，位於名為“banana”的表單中。 然后，每個輸入的值將可用

document.forms["banana"]["skin"][0] ，

document.forms["banana"]["skin"][1] ，和

document.forms["banana"]["skin"][2] 。

換句話說，同名特定形式的元素成為類似數組的元素集合，並且可以通過標准數組索引語法進行訪問。

值得注意的是，由於這些結構是文檔對象模型（DOM）的一部分，因此沒有任何特定實現支持將它們視為本機JavaScript數組的正式要求，因此諸如length和方法之類的屬性如並非所有平台都支持sort 。

實際上，JQuery等庫的主要目的之一是保護開發人員免受此類異常的影響; 不幸的是，現在更多地使用圖書館來讓開發人員不知道他們工作的真實性質，同時設法創造一種能力的印象。 如果你繼續使用JavaScript和DOM並且不使用JQuery，你將迅速成為一個更有能力的Web開發人員，而不是那些急於使用快速的JQuery解決方案回答Stack Overflow上的每個JavaScript問題的人中的99％這既不是尋求也不是期望。

我不是唯一一個立即拒絕任何沒有JQuery無法工作的Web開發人員角色的人。 實際上，我希望任何使用JQuery的人都能閱讀並理解源代碼。 那些沒有的人很容易識別; 例如，他們認為JQuery有一種與眾所周知的技術不同的魔術醬。

然后，有時候，那些知道眾所周知的技術但卻沒有閱讀過來源的人犯了同樣的錯誤，認為這是一個神奇的調味品，正如Eric對我的答案的評論所見： AJAX的意外緩存導致了IE8 （對不起） ，埃里克;-)）

Answer 3

您正在尋找JavaScript ForEach Equivalent 。

for(var elementName in form.elements)
{
    alert("form."+elementName+": "+elements[elementName]);
}