为什么如果我在同一页面中有多个表单且具有相同的输入文件ID，那么只需要第一个ID？

Question

我在

这样的文件中有多个表单

<form name="myForm">
<input type="hidden" value="1" id="lastphp">
<a onclick="ajaxFunction()" class="folloo">
</form>
<form name="myForm">
<input type="hidden" value="2" id="lastphp">
<a onclick="ajaxFunction()" class="folloo">
</form>
<form name="myForm">
<input type="hidden" value="3" id="lastphp">
<a onclick="ajaxFunction()" class="folloo">
</form>
<form name="myForm">
<input type="hidden" value="4" id="lastphp">
<a onclick="ajaxFunction()" class="folloo">
</form>

但是当我点击任何链接时，它总是采用第一个ID，即1 ??

Answer 1

ID必须是页面唯一的，因为它是该元素的键。

为什么不将id =“lastphp”更改为class =“lastphp”并将表单传递给函数？

<form name="myForm">
    <input type="hidden" value="1" class="lastphp">
    <a onclick="ajaxFunction(this.parentNode)" class="folloo">Test</a>
</form>
<form name="myForm">
    <input type="hidden" value="2" class="lastphp">
    <a onclick="ajaxFunction(this.parentNode)" class="folloo">Test</a>
</form>
<form name="myForm">
    <input type="hidden" value="3" class="lastphp">
    <a onclick="ajaxFunction(this.parentNode)" class="folloo">Test</a>
</form>
<form name="myForm">
    <input type="hidden" value="4" class="lastphp">
    <a onclick="ajaxFunction(this.parentNode)" class="folloo">Test</a>
</form>

并且喜欢这个

function ajaxFunction(form) {
    var lastphp = form.getElementsByClassName("lastphp")[0].value;
    alert(lastphp);
}

使用jQuery这样的框架可以更容易。