0

メインのjsファイルでいくつかの関数を実行していますが、そのうちの1つに2行追加すると、このエラーが表示されます。奇妙なことに、エラーは、呼び出されている関数とはまったく関係のない他の関数の1つにある変数を参照しています。

これが私が変更した関数です：

window.onresize = function(){
    var timeOut = null;
    if(timeOut != null) clearTimeout(timeOut);
        setTimeout(expandWrapper, 500);
}

var expandWrapper = function(){ 
    //var eContent = document.getElementById("content");
    var eContent = document.getElementById("main-content");
    var eMainContent = document.getElementById("column-1");
    var elayoutArea = document.getElementById("layout-column_column-1");
    var eFooter = document.getElementById("footer");
    //var dScrollb = $(".dataTables_scrollBody");
    var leftWrapper = document.getElementById("left-links-wrapper");
    var contentEnd = eMainContent.clientHeight + eMainContent.offsetTop;

    if(document.documentElement.clientHeight >= (eContent.offsetTop  + elayoutArea.clientHeight + eFooter.clientHeight)){       
        eMainContent.style.height = document.documentElement.clientHeight - eContent.offsetTop - eFooter.clientHeight -1 + "px";
        added line--> leftWrapper.style.height = document.documentElement.clientHeight - eContent.offsetTop - eFooter.clientHeight -1 + "px";
        //console.log("primary condition");
    } else {
        eMainContent.style.height = ($(window).height()); //elayoutArea.clientHeight + "px";
        added line-->leftWrapper.style.height = eMainContent.offsetHeight + "px";
        //console.log("fallback");
    }   
}

ifステートメントにあり、「」で始まる2つの追加行を指摘しましたleftWrapper.style.height。ちなみに、eMainContent要素はすべてのページに表示されますが、leftWrapper要素は特定のページにのみ表示され、エラーはleftWrapperが存在しないページにのみ表示されます。

これが問題の原因だと思います。特定のページに存在しない要素に対して要求したアクションを実行できないため、JavaScriptが反転します。

これが問題であると仮定して、このエラーを軽減するためにこれを書き直して、それが存在するページのleftWrapperを変更するにはどうすればよいですか？

4

2 に答える 2

3

なぜjQueryとdomを混ぜているのですか？それは非常に紛らわしいです。

やってみませんか

var timeOut = null;
window.onresize = function(){
  clearTimeout(timeOut); // can always be done
  timeOut=setTimeout(expandWrapper, 500);
}

var expandWrapper = function(){ 
    var eContent = $("#main-content");
    var eMainContent = $("#column-1");
    var elayoutArea = $("#layout-column_column-1");
    var eFooter = $("#footer");
    var leftWrapper = $("#left-links-wrapper");
    var docHeight = $(document).height();
    var contentEnd = eMainContent.height() + eMainContent.offset().top;
    if(docHeight >= (eContent.offset().top  + elayoutArea.height() + eFooter.height())){       
            eMainContent.height(docHeight - eContent.offset().top - eFooter.height() -1);
        leftWrapper.height() = docHeight - eContent.offsetTop - eFooter.clientHeight -1 + "px";
            //console.log("primary condition");
        } else {
            eMainContent.height(($(window).height()); 
            leftWrapper.height(eMainContent.height);
            //console.log("fallback");
        }   
    }
于 2012-11-09T07:56:29.997 に答える
3

ご指摘のとおり、問題はgetElementById、DOMに存在しない識別子を渡すと呼び出しがnullを返すことです。

nullまたは未定義の可能性があるオブジェクトを操作しているこのような場合は、次のようにするだけです。

if (possiblyNullOrUndefinedVariable) {
  possiblyNullOrUndefinedVariable.doSomething();
}

これは、次のように短縮することもできます。

possiblyNullOrUndefinedVariable && possiblyNullOrUndefinedVariable.doSomething();

&&オペレーターの短絡を利用します。

注目に値する1つの注意点は、これがすべての変数に対して期待するように動作しないことです。0また、''誤った値です。文字列や数字を扱うことがわかっている場合は、代わりに次のようなことを行うことができます。

if (possiblyNullOrUndefinedVariable != null && possiblyNullOrUndefinedVariable != undefined) {
  possiblyNullOrUndefinedVariable.doSomething();
}
于 2012-11-09T08:01:15.363 に答える