4

我有一个脚本，可以在水平 div 上添加顶部滚动。该脚本必须将其添加到最多 10 个不同的 div 上。（从 mainplh_boAutoOddsTable1_divScrollContainer 到 mainplh_boAutoOddsTable10_divScrollContainer）

为此，我调用了脚本 10 次（以下是前 3 个示例）。但是，如果缺少其中一个 div，它会破坏脚本。

doublescroll(document.getElementById('mainplh_boAutoOddsTable1_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable2_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable3_divScrollContainer'));

例如，如果找不到 mainplh_boAutoOddsTable1_divScrollContainer 它会破坏我的 Javascript。我该如何解决这个问题？例如，如果找不到该 div 元素，则阻止该函数运行？

错误信息：

Uncaught TypeError: Cannot read property 'scrollWidth' of null

这是完整的 JavaScript：

function doublescroll(element) {
        var scrollbar= document.createElement('div');
        scrollbar.appendChild(document.createElement('div'));
        scrollbar.style.overflow= 'auto';
        scrollbar.style.overflowY= 'hidden';
        scrollbar.style.width= '506px';
        scrollbar.firstChild.style.width= element.scrollWidth+'px';
        scrollbar.firstChild.style.paddingTop= '1px';
        scrollbar.firstChild.appendChild(document.createTextNode('\xA0'));
        scrollbar.onscroll= function() {
            element.scrollLeft= scrollbar.scrollLeft;
        };
        element.onscroll= function() {
            scrollbar.scrollLeft= element.scrollLeft;
        };
        element.parentNode.insertBefore(scrollbar, element);
    }

doublescroll(document.getElementById('mainplh_boAutoOddsTable1_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable2_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable3_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable4_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable5_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable6_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable7_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable8_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable9_divScrollContainer'));
doublescroll(document.getElementById('mainplh_boAutoOddsTable10_divScrollContainer'));
4

4 回答 4

4

检查element函数中是否存在：

function doublescroll(element) {
        if(!element)
        {
            return false;
        }
        var scrollbar= document.createElement('div');
        scrollbar.appendChild(document.createElement('div'));
        scrollbar.style.overflow= 'auto';
        scrollbar.style.overflowY= 'hidden';
        scrollbar.style.width= '506px';
        scrollbar.firstChild.style.width= element.scrollWidth+'px';
        scrollbar.firstChild.style.paddingTop= '1px';
        scrollbar.firstChild.appendChild(document.createTextNode('\xA0'));
        scrollbar.onscroll= function() {
            element.scrollLeft= scrollbar.scrollLeft;
        };
        element.onscroll= function() {
            scrollbar.scrollLeft= element.scrollLeft;
        };
        element.parentNode.insertBefore(scrollbar, element);
    }
于 2013-07-05T15:42:00.197 回答
3

如果未找到该元素getElementById，null则返回。

https://developer.mozilla.org/en-US/docs/Web/API/document.getElementById?redirectlocale=en-US&redirectslug=DOM%2Fdocument.getElementById

在开始时检查您的功能。

function doublescroll(element) {
    if(element === null) {
        return;
    }

    //rest of code here.
于 2013-07-05T15:42:08.197 回答
2

让你的代码更健壮一点：

function doublescroll(element_id) {
        var element = document.getElementById(element_id);
        if (!element) return;
        var scrollbar= document.createElement('div');
        scrollbar.appendChild(document.createElement('div'));
        scrollbar.style.overflow= 'auto';
        scrollbar.style.overflowY= 'hidden';
        scrollbar.style.width= '506px';
        scrollbar.firstChild.style.width= element.scrollWidth+'px';
        scrollbar.firstChild.style.paddingTop= '1px';
        scrollbar.firstChild.appendChild(document.createTextNode('\xA0'));
        scrollbar.onscroll= function() {
            element.scrollLeft= scrollbar.scrollLeft;
        };
        element.onscroll= function() {
            scrollbar.scrollLeft= element.scrollLeft;
        };
        element.parentNode.insertBefore(scrollbar, element);
    }

doublescroll('mainplh_boAutoOddsTable1_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable2_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable3_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable4_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable5_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable6_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable7_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable8_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable9_divScrollContainer');
doublescroll('mainplh_boAutoOddsTable10_divScrollContainer');
于 2013-07-05T15:43:21.690 回答
1

检查函数开头的元素：

if(!element)
{
    return;
}
于 2013-07-05T15:44:25.517 回答