有些Javascript可在Localhost上运行，有些则不能-所有Java均可在远程服务器上运行？

Question

今天，我花了很多时间来设置本地测试服务器，在尝试手动安装一堆东西之后，我最终决定只使用WampServer，这看起来很棒。

在测试完我的网站后，我非常高兴地看到所有PHP都能完美执行，但是我注意到某些javascript似乎无法正常工作，并且某些图像无法加载。

所有路径都是相对的url(img/btn_bg.png)中的图像路径如下所示： url(img/btn_bg.png) 。 其中有些会显示，有些则不会，即使它们都位于本地同一位置，并且如果我手动键入路径/文件名，我也可以通过Web浏览器访问它们。 它们都显示在远程站点上。 我检查以确保路径不依赖于远程站点（不是绝对路径）。

我不太确定如何测试JavaScript的状态。 我有萤火虫，但是我不知道如何使用调试功能。 我曾尝试通过警报进行存根测试，但没有成功。 由于所有JS代码都在同一个文件中，因此它在远程服务器上可以正常工作，并且其中的某些在本地可以正常工作，所以我不确定它会发生什么？ 同样，路径都是相对的。

由于该项目是专有项目，因此不允许我透露很多代码，但是这里有一些示例：

    function changeDiv()
    {
    var direction = arguments[0];
    var tabs = new Array(
        'basics', 'operations', 'info', 'contractinfo', 'contractsize',
        'intent_tab', 'transportation', 'type', 'mep', 'materials',
        'clinicalresearch', 'consulting', 'collaboration', 'construction',
        'education', 'environmental', 'vendor', 'realestate', 'recs', 'fin');

var vis = new Array();
for ( a = 0; a < tabs.length; ++a )
{
    var temp = tabs[a];
    if (document.getElementById(temp).className.match('show'))
    {
        vis += tabs[a];
    }
}
if (
        vis == 'basics' || vis == 'operations' || vis == 'info' ||
        vis == 'contractinfo' || vis == 'contractsize' || vis == 'intent_tab' ||
        vis == 'transportation' || vis == 'materials' || vis == 'recs' ||
        vis == 'fin' )
{
    switch (vis)
    {
        case 'basics':
        document.getElementById('operations').className =
                        document.getElementById('operations').className.
                            replace(/\bhide\b/, 'show');
        document.getElementById('basics').className =
                        document.getElementById('basics').className.
                            replace(/\bshow\b/, 'hide');
        document.getElementById('back_button').className =
                        document.getElementById('back_button').className.
                            replace(/\bhide\b/, 'show');
        break;

        case 'operations':
        if (direction == 'next')
        {
            document.getElementById('info').className =
                                document.getElementById('info').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('operations').className =
                                document.getElementById('operations').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('basics').className =
                                document.getElementById('basics').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('operations').className =
                                document.getElementById('operations').className.
                                    replace(/\bshow\b/, 'hide');
            document.getElementById('back_button').className =
                                document.getElementById('back_button').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'info':
        if (direction == 'next')
        {
            document.getElementById('contractinfo').className =
                                document.getElementById('contractinfo').className.
                                     replace(/\bhide\b/, 'show');
            document.getElementById('info').className =
                                document.getElementById('info').className.
                                     replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('operations').className =
                                document.getElementById('operations').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('info').className =
                                document.getElementById('info').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'contractinfo':
        if (direction == 'next')
        {
            document.getElementById('contractsize').className =
                                document.getElementById('contractsize').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('contractinfo').className =
                                document.getElementById('operations').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('info').className =
                                document.getElementById('info').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('contractinfo').className =
                                document.getElementById('contractinfo').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'contractsize':
        if (direction == 'next')
        {
            document.getElementById('intent_tab').className =
                                document.getElementById('intent_tab').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('contractsize').className =
                                document.getElementById('contractsize').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('contractinfo').className =
                                document.getElementById('contractinfo').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('contractsize').className =
                                document.getElementById('contractsize').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'intent_tab':
        if (direction == 'next')
        {
            document.getElementById('transportation').className =
                                document.getElementById('transportation').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('intent_tab').className =
                                document.getElementById('intent_tab').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('contractsize').className =
                                document.getElementById('contractsize').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('intent_tab').className =
                                document.getElementById('intent_tab').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'transportation':
        if (direction == 'next')
        {
            document.getElementById('materials').className =
                                document.getElementById('materials').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('transportation').className =
                                document.getElementById('transportation').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('intent_tab').className =
                                document.getElementById('intent_tab').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('transportation').className =
                                document.getElementById('transportation').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'materials':
        if (direction == 'next')
        {
            document.getElementById('type').className =
                                document.getElementById('type').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('materials').className =
                                document.getElementById('materials').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('transportation').className =
                                document.getElementById('intent_tab').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('materials').className =
                                document.getElementById('materials').className.
                                    replace(/\bshow\b/, 'hide');
        }
        break;

        case 'recs':
        if (direction == 'next')
        {
            document.getElementById('fin').className =
                                document.getElementById('fin').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('recs').className =
                                document.getElementById('recs').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('type').className =
                                document.getElementById('type').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('recs').className =
                                document.getElementById('recs').className.
                                    replace(/\bshow\b/, 'hide');
        }

        break;

        case 'fin':
        if (direction == 'back')
        {
            document.getElementById('recs').className =
                                document.getElementById('recs').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('fin').className =
                                document.getElementById('fin').className.
                                    replace(/\bshow\b/, 'hide');
        }

        break;

    }
}
else 
{
    if (vis == 'type')
    {
        if (direction == 'next')
        {
            logic('q_16');
            document.getElementById('type').className =
                                document.getElementById('type').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else
        {
            document.getElementById('transportation').className =
                                document.getElementById('transportation').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('type').className =
                                document.getElementById('type').className.
                                    replace(/\bshow\b/, 'hide');
        }
    }
    else if ( vis != 'type')
    {
        if (vis == 'recs' && direction == 'next')
        {
            document.getElementById('fin').className =
                                document.getElementById('fin').className.
                                    replacec(/\bhide\b/, 'show');
            document.getElementById('recs').className =
                                document.getElementById('recs').className.
                                    replace(/\bshow\b/, 'hide');
            document.getElementById('calc_risk').className =
                                document.getElementById('calc_risk').className.
                                    replace(/\bshow\b/, 'hide');
            document.getElementById('recs_header').className =
                                document.getElementById('recs_header').className.
                                    replace(/\bhide\b/, 'show');
        }
        else if (vis == 'recs' && direction == 'back')
        {
            document.getElementById('type').className =
                                document.getElementById('type').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('recs').className =
                                document.getElementById('recs').className.
                                    replace(/\bshow\b/, 'hide');
            document.getElementById('calc_risk').className =
                                document.getElementById('calc_risk').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('recs_header').className =
                                document.getElementById('recs_header').className.
                                    replace(/\bshow\b/, 'hide');
        }
        else if (direction == 'next')
        {
            var tab_array = new Array('mep', 'realestate', 'vendor', 'environmental', 'education', 'construction', 'collaboration', 'consulting', 'clinicalresearch');

            var visTab = document.getElementById('vis_tab').value;

            for (x = 0; x < tab_array.length; ++x)
            {
                var temp_tab = tab_array[x];
                document.getElementById(temp_tab).className =
                                        document.getElementById(temp_tab).className.
                                            replace(/\bshow\b/, 'hide');
            }

            switch(visTab)
            {
                case 'mep':
                wholesale();
                break;

                case 'realestate':
                realestate();
                break;

                case 'vendor':
                vendor();
                break;

                case 'environmental':
                environment();
                break;

                case 'education':
                education();
                break;

                case 'construction':
                construction();
                break;

                case 'collaboration':
                collaboration();
                break;

                case 'consulting':
                consulting();
                break;

                case 'clinicalresearch':
                clinicalresearch();
                break;
            }

            document.getElementById('recs').className =
                                document.getElementById('recs').className.
                                    replace(/\bhide\b/, 'show');
            document.getElementById('calc_risk').className =
                                document.getElementById('calc_risk').className.
                                    replace(/\bshow\b/, 'hide');
            document.getElementById('recs_header').className =
                                document.getElementById('recs_header').className.
                                    replace(/\bhide\b/, 'show');

            recsPage();
        }
    }
    else
    {
        document.getElementById('type').className =
                                document.getElementById('type').className.
                                    replace(/\bhide\b/, 'show');
        //materials realestate vendor environmental education construction collaboration consulting clinicalresearch

        var b_vis = new Array('mep', 'realestate', 'vendor', 'environmental', 'education', 'construction', 'collaboration', 'consulting', 'clinicalresearch');

        for (x = 0; x < b_vis.length; ++x)
        {
            var temp_vis = b_vis[x];
            document.getElementById(temp_vis).className =
                                document.getElementById(temp_vis).className.
                                    replace(/\bshow\b/, 'hide');
        }
    }
}
}

上面的代码在大多数情况下都可以在各个div之间切换，但是这个特定的部分并不能一直起作用：

document.getElementById('recs').className =
    document.getElementById('recs').className.
        replace(/\bhide\b/, 'show');
document.getElementById('calc_risk').className =
    document.getElementById('calc_risk').className.
        replace(/\bshow\b/, 'hide');
document.getElementById('recs_header').className =
    document.getElementById('recs_header').className.
        replace(/\bhide\b/, 'show');

recsPage();

recsPage(); 永远不会在本地主机上被调用。 远程工作正常。 两者之间的代码是相同的。 其他地方还有其他地方没有运作，但是现在这是唯一与我有关的部分。

有任何想法吗？ 由于javascript是在客户端执行的，所以我无法想象为什么不在远程服务器上时为什么无法正常工作。

Answer 1

使用Firebug，启动“ Net”并查找404错误。 如果将鼠标悬停在文件名上，Firebug将显示路径，因此您应该能够推断出错误的出处。

另外，也请检查Firebug标签的“控制台”中是否有错误。 这应该为您提供解决问题的足够线索。