Question

该网站是静态的。我把语言选择器放在html上。我正在加载外部html div内容。

问题：

（a）默认情况下，它会从外部html div内容中加载两种语言
（b）如果我限制它仅加载一种语言，则内容它不会自动更改为“点击的语言”

例如必须对语言单击两次，另一个指向“ head link”，以便将外部div内容更改为与语言更改相对应的内容。

主HTML文件“ start.html”

Before:
Cl foo bar ClbarCl
After:
F foo bar FbarF

将div内容加载到start.html主体的外部“ stats.html”文件。

    <!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="keywords" content="">
    <meta name="description" content="">

    <!-- google web font css -->
    <link href='https://fonts.googleapis.com/css?family=Raleway:400,300,600,700' rel='stylesheet' type='text/css'>
    <!--- Search functionality --->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>    
</head>



<body class="bd">

    <a id="idStatistics"     href ="#Statistics"      > <span lang="en">Statistics      </span>     <span lang="gr">Στατιστική      </span>   </a> 


    <!--- The country flags --- Language Selector --->
    <a href="#el" id="lang_switch_gr" class="greek_flag" >
    <img title="greek_flag" src="img/Greek_flag_02.png" 
    alt=""/>
    </a>   

    <a href="#en" id="lang_switch_en" class="uk_flag" >
    <img title="uk_flag" src="img/uk_flag_01.png" 
    alt=""/>
    </a>   




<span lang="en">    To the extent possible under law,  </span>     

<span lang="gr">    έχει αποποιηθεί όλα τα δικαιώματά του επί του περιεχομένου του </span>



<p>-----------------------------------------------</p>
<div id="mainbody" class="mainbody">   </div>
<p>-----------------------------------------------</p>
<div id="mainbody_2" class="main_body">  </div>


</body><!-- body closing --> 


<script>
    // stackoverflow: 49637061  &  11134701 

    var lang="en";
      $('[lang="en"]').show();
      $('[lang="gr"]').hide();
           $(document).on('click', '#idStatistics', function(){
            $("#mainbody").load("Stats.html #st #en").data('url_idStatistics', "Stats.html#st#en");
          });  


     $("#lang_switch_gr").click(function(){
              var lang="gr";
    $('[lang="gr"]').show();
    $('[lang="en"]').hide();  
           $(document).on('click', '#idStatistics', function(){
            $("#mainbody").load("Stats.html #st").data('url_idStatistics', "Stats.html#st");
          });   
          });    

 $("#lang_switch_en").click(function(){
              var lang="en";
$('[lang="en"]').show();
$('[lang="gr"]').hide();
           $(document).on('click', '#idStatistics', function(){
            $("#mainbody").load("Stats.html #st").data('url_idStatistics', "Stats.html#st");
          });  
          });    
</script>

</html>

所有这些方法均失败：

<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="keywords" content="">
    <meta name="description" content="">

    <!-- stylesheet css -->
    <link rel="stylesheet" href="css/style.css">
    <!-- google web font css -->
    <link href='http://fonts.googleapis.com/css?family=Raleway:400,300,600,700' rel='stylesheet' type='text/css'>


</head>
    <body>
        <div id="st"  class="stat">

<span lang="en">    Statistics is a science based on probabilities  </span>     

<span lang="gr">   στατιστική   στατιστική   στατιστική   στατιστική    </span>

</div>
</body>


</html>

从外部html div文件自动加载特定于语言的内容

0 个答案: