javascript - 返回 HTML FORM 变量名称(非值)

Question

这可能是一个非常简单的问题，但我似乎无法正确回答。

是否可以从 FORM 中提取变量“名称”？我有以下下拉菜单(简化)...

<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>

这些都通过“onChange”语句触发一些java脚本。到目前为止一切顺利。

我想提取名称，而不是值，然后在中使用提取的名称 如下所示的 java 脚本语句:

var info = form.*name*.value; 

getElementsByName 给我的是值而不是名称。

有什么想法吗？

干杯 弗兰克

Answer 1

也许这段代码会对您有所帮助。 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]也会给出相同的结果，但由于您不知道索引，所以它对您没有好处。

<小时/> 更新

阅读您关于仅管理一个脚本的评论后，我想我已经理解您的问题了。只需对代码进行一些小的调整，这应该就是您正在寻找的:

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...
}

您不再需要为每个 <select> 提供 3 个不同的功能元素。 :)Check it out here. ​