Question

当有人点击它时，我试图用输入替换输入的值，

我尝试了以下内容，但我一直在控制台中收到此错误，你可以帮我解决吗？

elem.addEventListener不是函数

HTML

<input type='text' name='first-name' value='first name' class='fieldedit' />

JS

<script type="text/javascript"> 
    var elem = document.getElementsByClassName('fieldedit');

    function fieldedit() {
        if (this.value == this.defaultValue) {
            this.value = '';
        }
    };

    if(elem){
        elem.addEventListener('focus' , fieldedit , false ) ; 
        elem.addEventListener('blur' , fieldedit , false ) ; 
    }
</script>

Answer 1

您正在尝试将addEvent侦听器添加到数组中，您需要一个特定的元素。对于所有领域：

var elem = document.getElementsByClassName('fieldedit');

for (var i=0; i<elem.length; i++) {
    elem[i]. // apply your function here
    // do your processing here
}

Answer 2

document.getElementsByClassName返回类似于元素数组的类似内容。因此，您需要：

for(var i = 0; i < elem.length; i++){
    elem[i].addEventListener('focus', fieldedit, false); 
    elem[i].addEventListener('blur', fieldedit, false); 
}

Answer 3

document.getElementsByClassName返回一个数组尝试在数组的第一项上附加addEventListener 检查此代码段

var elem = document.getElementsByClassName('fieldedit');

function fieldedit() {
  if (this.value == this.defaultValue) {
    this.value = '';
  }
};

if (elem.length > 0) {
  elem[0].addEventListener('focus', fieldedit, false);
  elem[0].addEventListener('blur', fieldedit, false);
}

<input type='text' name='first-name' value='first name' class='fieldedit' />

清空输入字段的值

3 个答案: