Question

我有一个Javascript代码，可以用其他语言翻译我的HTML页面的一些部分。您可以在我在此处提出的另一个问题中阅读有关它的更多详细信息：Multilanguage static website with JQuery

我的网站中的每个HTML页面都有相同的Javascript代码。在主页（www.mywebsite.com）工作，但在任何其他更长的路径（www.mywebsite.com/anotherpage）不起作用。奇怪的是，代码完全没有从页面的源代码中删除（右键单击 - ＆gt;查看源代码）

以下是代码的一部分（整个页面很大，我无法将其全部粘贴）

<html lang="en">
   <head>   
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <!-- Le styles -->
      <link href="./static/css/bootstrap.min.css" rel="stylesheet">
      <link href="./static/css/slider.css" rel="stylesheet">
      <link rel="stylesheet" href="./static/css/font-awesome.css" />
      <link rel="stylesheet" href="./static/css/jquery-ui.css" />

   </head>
   <body>
   ....
   </body>
   <script src="./static/js/jquery.js"></script>
   <script src="./static/js/bootstrap.min.js"></script>
   <script src="./static/js/bootstrap-slider.js"></script>
   <script src="http://code.highcharts.com/highcharts.js"></script>
   <script src="./static/js/jquery.dataTables.min.js"></script>
   ! a few other script codes that works without a problem in this part !

   ! this is the one that is missing from the code
   <script type="text/javascript">

      function getCookie(name) {
         var nameEQ = name + "=";
         var ca = document.cookie.split(';');
         for(var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') c = c.substring(1, c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
         }
         return null;
      }

      $(function() {

         var language = getCookie("language");
         if (language == null) {
            var language = 'English'
         }
         alert(language)
         $.ajax({
            url: './static/languages/languages.xml',
            success: function(xml) {
               $(xml).find('translation').each(function(){
                  var id = $(this).attr('id');
                  var text = $(this).find(language).text();
                  $("." + id).html(text);
               });
            }
         });
      });

   </script>

我试图将脚本代码放在页面顶部，但我遇到了同样的问题。我试图将完整的URL放在xml文件上但没有成功。我在控制台上没有任何错误，脚本也不会在页面源代码上运行。

解决：

如果我从外部文件加载脚本代码，那么它可以工作。外部文件具有完全相同的代码，因此不是印刷错误。

Answer 1

我认为您可以使用<base>代码：

<head>
<base href="http://www.mywebsite.com/" target="_self">
</head>

或使用像<link href="/static/css/bootstrap.min.css" rel="stylesheet">这样的“绝对”路径（开头没有点）。如果在开头有一个点，则认为它附加到当前路径（在您的示例中，它提供www.mywebsite.com/anotherpage/static/css/bootstrap.min.css而不是www.mywebsite.com/static/css/bootstrap.min.css）。同样的规则适用于ajax URL。 See

此外，您的网络选项卡中没有任何对xml文件的ajax请求与...缺少<script>（显然......）严格相关。但是很难说为什么缺少这个脚本，因为你没有提供有关如何生成html代码的信息（它是静态html文件或模板？你使用任何框架吗？）。

Answer 2

您应该尝试将函数提取到外部文件中，并像其他文件一样引用它：

<script src="../static/js/bootstrap-slider.js" type='text/javascript'></script>

此外，在html页面上包含js代码并不是一种好的做法，删除html元素时可以删除代码等。

页面源代码中缺少Javascript代码

2 个答案: