Question

如何避免此错误？它有效，但我总是看到这个错误，这里是代码：

function Separe(price) {
    nStr = Number(document.getElementById(price).value) * 100
    nStr += '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(nStr)) {
        nStr = nStr.replace(rgx, '$1' + ' ' + '$2');
    }
    return nStr + " Centimes"
}

function Forma(price, dest) {
    var handler = function(e) {
        document.getElementById(dest).innerHTML = Separe(price)
    };
    document.getElementById(price).onchange = handler; //line 50
    document.getElementById(price).onkeyup = handler;
}

和HTML：

<input id="prix" type="number" name="prix" min="1" step="1">
<script>
    Forma("prix", "hhh"); //profil 148
</script>
<h1 id="hhh" >&nbsp;</h1>

我的页面在加载时发出错误：

Uncaught TypeError: Cannot set property 'onchange' of null formatter.js:50
Forma formatter.js:50
(anonymous function) profil:148

我这样做是为了避免两次onchange和onkeyup

该变量尚未生成，这是错误的原因，但我该如何避免呢？我甚至试图添加所有变量并将它们初始化为空值，但仍然得到错误！

Answer 1

完全避免此错误的唯一方法是在查询时让您在DOM中准备好要素。

假设你有这个HTML：

<span id="monkey">Hey I'm a monkey</span>
Result for hopeful monkey:<span id="result"></span>
Result for not so hopeful monkey:<span id="noresult"></span>

和这个javascript：

var hopefulMonkey = document.getElementById("monkey");
document.getElementById("result").innerHTML = hopefulMonkey;

var notSoHopefulMonkey = document.getElementById("noMonkeys");
document.getElementById("noresult").innerHTML = " "+notSoHopefulMonkey;

输出结果为：

Hey I'm a monkey 
Result for hopeful monkey:[object HTMLSpanElement] 
Result for not so hopeful monkey: null

因此，您正在尝试访问一个显然尚不存在的元素，或者在您收到该错误时根本不存在该元素。

也就是说，由于您发布的代码在Chrome中有效，因此您还有其他因素导致您遇到麻烦。你在运行什么版本？

我弄错了你的问题：http://jsfiddle.net/EqtQz/

我做了一个小提示，展示了我的答案：http://jsfiddle.net/vB2Jp/1/（它有猴子所以它也很有趣！）

Answer 2

似乎我在代码中是一个重复的函数！该页面使用手风琴效果，并且该功能被调用两次（购买区域和销售区域），即使id不同，代码也会发出错误信息，这很奇怪;但只有第一个呼叫工作，而不是第二个。

在第二个它是一个不同的id：

<script>
Forma("hh", "max");
</script>

...

<script>
Forma("h", "min");
</script>

我所做的，是改为第二个

<input .... onkeyup="document.getElementById('h').innerHTML = Separe('min')"  onchange="document.getElementById('h').innerHTML = Separe('min')"/>

它有效！现在Chrome也不提醒我，即使第一部分（买）会按照我的问题调用该功能！

如何避免TypeError：无法设置null的属性'onchange'

2 个答案: