0

当用户键入时，我正在努力将放入文本输入框中的值传递给另一个文本输入框。我在 jsfiddle 上得到了一切工作，但由于某种原因，如果我在其他任何地方使用它，我就无法让它工作。我使用纯 javascript，而不是 jquery。

所以，这是我的html代码

    <input id="imput1" type="text" class="firstbox">
    <p>Box to Retrieve The Input</p>
    <br />

    <input id="gift_card_recipient" type="text" class="replica" value="box1" />
    <input type="text" class="replica2" value="box2" />

以及我用来将值作为用户类型从第一个框传递到第二个框的 Javascript：

(function() {
var var1   = document.getElementById('imput1'),
    var2   = document.getElementById('gift_card_recipient'),
    callback = function () {
        var2.value = this.value;
    };

if (var1.addEventListener) {
    var1.addEventListener('keyup', callback);
} else {
    var1.attachEvent('onkeyup', callback);
}
}());

再一次，我让它在 jsfiddle 上工作，这里是一个演示它的样子，但由于某种原因，如果我在我的电脑上的 html 文件或我的服务器上使用它，它不会工作。我在标题中链接了 js 文件，并在 chrome 中检查了它。这是我从 chrome 得到的错误：

Uncaught TypeError: Cannot read property 'addEventListener' of null

不太清楚为什么它会扔那个。但这是我的 jsfiddle，我确实可以使用它。但不在服务器或我的电脑上：http: //jsfiddle.net/C3SPM/

4

1 回答 1

0

在正文的末尾（或有问题的元素之后）包含您的脚本块。或者将您的代码包装在 onload/onDomReady 处理程序中。

您遇到的具体错误是因为您的代码在解析相关元素之前正在运行，这意味着document.getElementById('imput1')返回null是因为它找不到该元素。它在小提琴中工作的原因是，默认情况下 jsfiddle 将任何 JS 包装在 onload 处理程序中，因此当代码运行时，元素已被解析（您可以使用左侧“框架”下的下拉菜单在 jsfiddle 中更改此设置& 扩展”）。

于 2013-10-07T10:15:19.597 回答