javascript - Document.getElementById.value 返回未定义

Question

以下是我的 HTML 代码

<div id="dl_address" class="dl-row">
 <div class="dl-col1">
    <span id="dl_addressMarker" class="dl-Marker">*</span>Address:
 </div>
 <div class="dl-col2">
  <input  id="dl_addressMarker" name="p.streetAddress" maxlength="100" size="15"  
                            class="landing-qualpanel-input-standin" type="text" onClick="formOpt(id)" value="Home Address">
 </div>
</div>

下面是我的 JavaScript 代码

<script language="javascript" type="text/javascript">
function formOpt(x){

    var y=document.getElementById(x).value;
    alert(y);
    }
</script>

我不明白为什么我会变得未定义。请帮助。提前致谢

Answer 1

这是因为您有两个具有相同 Id 的元素，这在 HTML 中是不允许的，并且使您的函数无法以这种方式获取输入。

更改输入的 ID 就可以了。

您可以通过传递元素而不是 id 来简化代码:

HTML:

<input  id="dl_addressMarker2" name="p.streetAddress"
      maxlength="100" size="15"  
      class="landing-qualpanel-input-standin" type="text"
      onClick="formOpt(this)" value="Home Address">

JavaScript:

function formOpt(x){
   var y = x.value;
   alert(y);
}