一些Javascript在Localhost上工作，有些则不能 - 所有工作在远程服务器上？

时间：2011-09-15 09:20:51

标签： php javascript localhost wamp wampserver

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

在测试完我的网站后，我很高兴看到所有的PHP执行完美，但我注意到一些javascript似乎没有工作，有些图像无法加载。

所有路径都是相对的 - css中的图像路径如下所示：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();
永远不会在localhost上调用

recsPage();。它远程工作正常。两者之间的代码是相同的。其他地方还有其他部分没有运作，但现在这是唯一让我担忧的部分。

有什么想法吗？由于javascript执行客户端，我无法想象当它不在远程服务器上时它为什么不起作用。

1 个答案:

答案 0 :(得分：1)

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

另外，请检查Firebug选项卡“console”是否存在错误。这应该给你足够的线索来解决问题。

相关问题
最新问题