返回HTML FORM變量名稱（不值）

這可能是一個非常簡單的問題，但我似乎無法得到正確的結果。返回HTML FORM變量名稱（不值）

是否可以從FORM中提取變量「名稱」？我通過「的onChange」聲明有如下下拉菜單（簡體）...

<FORM NAME="doc_select"> 
    <SELECT ID="rec_list" NAME="rec_info"><OPTION>...</OPTION></SELECT> 
    <SELECT ID="term_list" NAME="term_info"><OPTION>...</OPTION></SELECT> 
    <SELECT ID="comp_list" NAME="comp_info"><OPTION>...</OPTION></SELECT> 
</FORM>

這些都引發了一下Java的腳本。到現在爲止還挺好。

我想提取的名稱，而不是價值，然後使用提取的名字一個java腳本語句象下面這樣：

var info = form.*name*.value;

getElementsByName帶給我的價值不是名字。

任何想法？

乾杯弗蘭克

來源

2012-09-28 Frankie G

如果您已經知道元素的名稱，則使用'getElementsByName'，這似乎不是您在此處執行的操作。也許你想'getElementsByTagName'然後遍歷它們？我不太清楚你想達到什麼目的。 –

您是否想要獲取已更改的選擇的名稱？ –

讓我澄清，如果我可以。我有一點javascript，它顯示了從各種下拉菜單中選擇的任何文檔的簡要摘要。目前我有這個腳本的多個副本來處理每個下拉菜單，因爲它們都有不同的名稱。不同的名稱隻影響腳本的一行，所以如果我可以提取該名稱的值，我可以在該行中使用它，因此只保留腳本的一個副本。 –

我不清楚你的問題是什麼，所以這是一些一般的東西。爲了得到那個叫聽者元素的名稱，通過this：

<select id="rec_list" name="rec_info" onchange="someFn(this)" ... >

你可以做很多與動態添加監聽器相同。在功能：

function someFn(element) { 
    var elementName = element.name; 
    var theForm = element.form; 
    var theValue = element.value; 

    // and so on ... 

}

您也可以使用其名稱來訪問窗體控件的形式的性質，因此，一旦您的窗體的引用：

form.comp_info

是在第三個選擇元素OP。請注意，在這種特殊情況下，如果有一個具有該名稱的控件，則返回該元素的引用。如果有多個具有相同名稱的控件，則返回一個集合。還要注意，IE混淆了名稱和標識符，所以不要使用同一個值作爲一個控件的名稱和另一個控件的ID。

的getElementsByName方法返回一個集合，成員可以通過索引訪問，從而第一個是：

var someElement = document.getElementsByName('foo')[0];

注意，如果有與「富」的名字沒有任何元素，然後someElement將有值爲undefined。

來源

2012-09-28 01:02:44 RobG

非常好，我只是傳遞了變量並使用了var elementName = element.name;儘管我的變量是調用「infoName」。還有一個問題，現在我有價值，我怎麼把它分解成形式陳述？ var info = form。+ infoName + .value;道歉是這是一個沒有道理的，只是可以; t得到這最後一塊 –

方括號表示法將計算表達式以獲得名稱：'form [infoName] .value'。但是，這隻會返回具有相同名稱的相同元素或元素集合。我不明白你爲什麼想這樣做。 – RobG

當您使用getElementsByName，你只是要求與name屬性的HTML元素。你需要的是從HTMLElement獲得屬性「名稱」。如果你能夠使用jQuery，你可以使用jQuery .attr（）函數。

編輯：看看這個StackOverflow的問題Get elements by attribute when querySelectorAll is not available without using libraries?

來源

2012-09-28 00:30:39 netpoetica

嘗試...... ` VAR rec_list = document.querySelector（「＃rec_list」）;

alert（rec_list.name）; `

來源

2012-09-28 00:35:07

也許這段代碼會幫到你。Check out a demo of this here.

form = document.doc_select; 

document.getElementById('rec_list').onchange = function() { 
    n = this.name; 

    var info = form.elements[n].value; 
    console.log('name: ' + n);   //name: rec_info 
    console.log('info: ' + info);  //info: 2 
};

通過使用.name獲得元素的名稱。函數elements[]函數根據名稱或索引返回元素。例如，elements[0]也會給出相同的結果，但由於您不知道索引，因此您沒有好處。

UPDATE

閱讀您的評論，有關管理只有一個腳本後，我想我明白你的問題。只需幾個小的調整，對代碼這應該是你在找什麼：

form = document.doc_select; 

document.getElementById('rec_list').onchange = function() { 
    onChangeFunction(this.name); 
}; 
document.getElementById('term_list').onchange = function() { 
    onChangeFunction(this.name); 
}; 
document.getElementById('comp_list').onchange = function() { 
    onChangeFunction(this.name); 
}; 

function onChangeFunction(name){ 
    //...your code goes here... 

    var info = form.elements[name].value; 
    console.log('name: ' + name);   //outputs name of element that changed 
    console.log('info: ' + info);   //outputs value for that element 

    //...more of your code... 
}

您不再需要3個不同的功能，爲您的每個<select>元素。 :) Check it out here.

來源

2012-09-28 01:16:45 Aust

@FrankieG - 查看我的更新。 – Aust

返回HTML FORM變量名稱（不值）

回答

相關問題