TypeError:ID不是函数

TypeError: ID is not a function

本文关键字:函数 ID TypeError      更新时间:2023-09-26

当我在表单字段中键入时,底部的输入也应该自动写入与上述字段相同的地址。

当我在外部有输入时,我使用的JavaScript就可以工作了,正如你所看到的,但我需要它在表单中提交。我在控制台中得到的错误是"TypeError:autoAddress不是函数">WORKS 下面的表格

<form id="addNews" name="address" action="addevent.php" method="post" class="addStuff" enctype="multipart/form-data">
    <h3>Address1:</h3><input type="text" class="title" name="address1" onkeyup="autoAddress();">
    <h3>Address2:</h3><input type="text" class="title" name="address2" onkeyup="autoAddress();">
    <h3>City:</h3><input type="text" class="title" name="city" onkeyup="autoAddress();">
    <h3>County:</h3><input type="text" class="title" name="county" onkeyup="autoAddress();">
    <h3>PostCode:</h3><input type="text" class="title" name="pcode" onkeyup="autoAddress();">       
</form>
<input type="text" name="fulladdress" class="title" id="autoAddress" />

我需要的东西不起作用,在下面。我确信我只是错过了一些简单的东西。注意底部的输入在表单中

<form id="addNews" name="address" action="addevent.php" method="post" class="addStuff" enctype="multipart/form-data">
    <h3>Address1:</h3><input type="text" class="title" name="address1" onkeyup="autoAddress();">
    <h3>Address2:</h3><input type="text" class="title" name="address2" onkeyup="autoAddress();">
    <h3>City:</h3><input type="text" class="title" name="city" onkeyup="autoAddress();">
    <h3>County:</h3><input type="text" class="title" name="county" onkeyup="autoAddress();">
    <h3>PostCode:</h3><input type="text" class="title" name="pcode" onkeyup="autoAddress();">
    <input type="text" name="fulladdress" class="title" id="autoAddress" />
</form> 

JavaScript如下

function autoAddress(){
    var address1 = document.address.address1.value;
    var address2 = document.address.address2.value;
    var city = document.address.city.value;
    var county = document.address.county.value;
    var postcode = document.address.pcode.value;
    var parts = [
        address1,
        address2,
        city,
        county,
        postcode
      ];
    var address = new Array();
    for (var i=0; i<=parts.length; i++){
        if (parts[i]){
            address.push(parts[i]) ;
        }
    }
    var joined = address.join(', ');
    document.getElementById('autoAddress').value = joined;
  }
<input type="text" name="fulladdress" class="title" id="autoAddress" />
                                                    ^^^^^^^^^^^^^^^^
function autoAddress(){
         ^^^^^^^^^^^

这实际上可能是这里的问题——一些浏览器倾向于将HTML元素的ID导入全局JavaScript命名空间(Internet Explorer是这里的主要罪犯,但其他浏览器出于兼容性原因也采用了相同的行为(。这可能导致JavaScripts中的实际JS对象/变量在被覆盖之前加载。

因此,尝试将HTML元素和JavaScript函数命名为不同的名称。

<input type="text" name="fulladdress" class="title" id="autoAddress" />

我自己也有过这样的错误,id autoAddress在DOM中创建了一个对象。更改函数名称或ID,它将在中工作

重命名函数(或<input>(。

<input type="text" name="fulladdress" class="title" id="autoAddress" />

在表单中,对于所有<... onkeyup="autoAddress();"/> autoAddress,这里实际上是对具有autoAddress id的元素的引用。当<input>在函数之外时,这种情况不会发生(因为<script>标记的作用域,无论放在哪里,都具有更高的优先级(。

因此,重命名函数或输入(或将其保留在<form>之外(