的JavaScript行为不同本地和服务器

，所以我开发了许多HTML页面的网站上和现在我有JavaScript的问题，真正困扰我。事情是我的网站在本地工作得很好，但是当我将它托管在服务器上时，一些JavasScript代码会停止工作（有时会起作用），并且有趣的是，当检查它时，我没有得到任何控制台JS错误以及什么更有趣的是，不工作的JS与其他工作的js代码在同一个.js文件中。而且，本地所有工作都是100％。那么，问题是，我的手机媒体查询dropwdown菜单JS停止wroked当我托管在服务器上 - 原来的代码是这样的：的JavaScript行为不同本地和服务器

$(function(){ 
    $(document).mousedown(function(){ 
     $('.dropdown .active').removeClass('active').children('ul').hide(); 
    }); 
    $('.dropdown').on('mousedown','.subMenu', function(e){ 
     e.stopPropagation(); 
     var elem = $(this); 
     if(elem.is('.active')) { 
      elem.children('ul').slideUp(150); 
      elem.removeClass('active'); 
     } else { 
      $('.dropdown .active').removeClass('active').children('ul').hide(); 
      elem.addClass('active').children('ul').slideDown(150); 
     } 
    }); 
    $('.subMenu').on('mousedown','ul', function(e){ 
     e.stopPropagation(); 

    });  
}); 

$("#footer").load("footer.html"); 
$("#header").load("header.html");

正如你可以看到我使用单独的页脚和页眉的html文件并使用JS将它们上传到我的页面。 <div id="header"></div>这工作完美的地方，但是当我托管它到服务器我的手机下拉有时工作，有时不......看起来，我设法使JavaScript的工作以更好的成功率编辑它到这个：

$(document).ready(function() { 
$(function(){ 
    $(document).mousedown(function(){ 
     $('.dropdown .active').removeClass('active').children('ul').hide(); 
    }); 
    $('.dropdown').on('mousedown','.subMenu', function(e){ 
     e.stopPropagation(); 
     var elem = $(this); 
     if(elem.is('.active')) { 
      elem.children('ul').slideUp(150); 
      elem.removeClass('active'); 
     } else { 
      $('.dropdown .active').removeClass('active').children('ul').hide(); 
      elem.addClass('active').children('ul').slideDown(150); 
     } 
    }); 
    $('.subMenu').on('mousedown','ul', function(e){ 
     e.stopPropagation(); 

    });  
}); 
}); 
$("#footer").load("footer.html"); 
$("#header").load("header.html");

还有一重要的事情 - 每个HTML文件（execpt的index.html）有一个内部的JavaScript代码，给出了一个特定的ID元素的类，它突出在其上的用户是在页面的名称（按钮）。它看起来是这样的。：

 <script> 
    $("#header").load("../pages/header.html", function() { 
     document.getElementById('A_57').className = 'about'; 
     document.getElementById('A_577').className = 'about'; 
    }); 
     $("#footer").load("../pages/footer.html", function() {  
    }); 

     </script>

在这种情况下，它的目标有两个ID，因为一个ID是在UL，只有apears移动视图和其他UL只有在其他所有媒体查询apears，但是这并不重要。

重要的是要拿出一个解决方案，所有的javascript 3码上下一心的服务器上。也将是很好听，而当地一切正常，看来Javascript代码共进午餐记数不同的服务器上的微细而...

更新：我可以确认的是，当我重新加载一个网页，我是在它100％下拉菜单的时间结果停止工作。另外从浏览器检查>网络> HTML我可以看到，1xheader.html和1xfooter.html从200（当下拉菜单工作）变成304（下拉菜单停止工作）。

来源

2016-08-20 Mkey

浏览器控制台中的任何错误？您能否在浏览器的网络标签中看到HTML文件的请求？ – jedifans

没有错误，但浏览器中的HTML请求让我知道发生了什么。我第一次去页面获取header.html的2个请求和footer.html的2个请求（一切正常） - 所有200个代码（确定）。但是当我重新加载页面，我得到相同数量的请求2x头和2x页脚，但1x头和1xfooter现在有304代码（未修改），这次下拉菜单不起作用。 Jedifans感谢你我们正在做的事情！ – Mkey

我不确定这是不是一件事，但在您的服务器中启用了JavaScript？你的MIME类型是不是'.js'？ –

的问题是它被重定向到我的另一个测试网页时有相同的外观.htaccess文件。

来源

2016-09-18 20:50:07 Mkey

根据this question，我敢打赌，你会发现jQuery的.load()函数存在奇怪的缓存行为。尝试将

$.ajaxSetup ({ 
    // Disable caching of AJAX responses 
    cache: false 
});

添加到您的脚本，然后再进行任何load调用。

来源

2016-08-21 03:06:03

的JavaScript行为不同本地和服务器

回答

相关问题