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，则将事件处理程序附加到窗口就绪中，但是该事件已被触发，并且不会再次触发。

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

另一个可能的解决方案：

$(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); 在加载内容后隐藏加载程序。