Rails：-location.Href在项目中不起作用

Question

我是javascript的新手，正在项目中实现一个加载器..

我使用下面的代码来实现加载程序，但它不起作用： -

 var url = "http://localhost:3500/#!/Movies";
<script>
    $(function(){                                            //Loader implementation
        if (location.href==url){

            $(window).ready(function(){
                $('#loadIndicator1').fadeOut(1000);
                return false;
            });

        }
    });


</script>

我在代码中调用loadindicator： -

<ul>
    <li id="loadIndicator1" style="position:absolute ;top:50%;left:50%;z-index:99999;"></li>
  </ul>

我不太清楚为什么会出现问题。我正在使用jquery-1.8.3.min.js和jqueryui-1.10.2.js

当我将鼠标悬停在位置上时......我得到unresolved variable location。请帮助我。

Answer 1

使用

 if (window.location.href==url)

而不是

if (location.href==url)

Answer 2

仅使用文档就绪忽略窗口

$(function() {
    if (window.location.href === url){
        // $(window).ready(function(){
            $('#loadIndicator1').fadeOut(1000);
            return false;
        // });
    }
});

您应该删除我已注释掉的部分。问题是，你附加了一个事件处理程序来准备文档，如果你在特定的URL上，你将事件处理程序附加到窗口就绪，但是该事件已经被触发，并且它不会被再次触发。 / p>

文档准备好后使用窗口加载

另一种可能的解决方案：

$(function() {
    if (window.location.href === url){
        $(window).load(function(){
            $('#loadIndicator1').fadeOut(1000);
            return false;
        });
    }
});

窗口加载事件稍后会触发，而不是文档就绪 - 尽管应该对此进行测试。

仅使用窗口加载

忽略文档就绪

第三次是魅力，另一种解决方案可能是最好的，只需忽略文档就绪事件，并且只使用窗口加载：

$(window).load(function () {
    if (window.location.href === url) {
        $('#loadIndicator1').fadeOut(1000);
        return false;
    }
});

这种情况虽然只有在页面上加载了所有内容时才会出现加载程序，所以这可能不是您想要的 - 在这种情况下使用第一个选项。

Answer 3

var url = "http://localhost:3500/#!/Movies";
$(function(){
    if (location.href==url){
        $(window).load(function(){ 
            $('#loadIndicator1').fadeIn(1000);
        });
    }
});

这将在网页完全下载后显示您的加载程序

在加载内容后使用$('#loadIndicator1').fadeOut(1000);隐藏加载程序。