обработчики событий JavaScript не работают должным образом

Question

У меня есть проблема с обработчиками событий javascript, и я действительно хочу знать, что я делаю неправильно.Вот в чем дело, я хочу предупредить ширину находящегося div, но как только страница загружается, появляется предупреждение.

Вот HTML:

<div id="mainContainer">  
    <div id="container_1" style="width:200px"></div>  
    <div id="container_2" style="width:100px"></div>  
    <div id="container_3" style="width:300px"></div>  
    <div id="container_4" style="width:150px"></div>  
</div>

и вот js:

dataRetrieving = {
    getWidth:function(id){
        var box = document.getElementById(id);
        var tempResult = box.style.width;
        return tempResult;
    }
}
var container = document.getElementById("container_1");
container.onmouseover = function(){
    alert(dataRetrieving.getWidth("container_1"));
};

уже ответил, спасибо: D

Буду признателен за любой совет, который вы мне дадите.*

Answer 1

Вам нужно установить onmouseover примерно так:

container.onmouseover = function(){
  dataRetrieving.getWidth("container_1");
};

В вашем текущем коде обработчик события (установлен на container.onmouseover) установлен на результат dataRetrieving.getWidth(...)- что ничто, поскольку getWidth в настоящее время ничего не возвращает.Это также приводит к немедленному появлению предупреждения, так как функция выполняется немедленно.(Для того, чтобы быть действительным, он должен был бы вернуть другую функцию.)

Answer 2

container.onmouseover = dataRetrieving.getWidth("container_1");

Вы вызываете эту функцию там, поэтому она оповещает о загрузке страницы.