2013-12-20 26 views
2

首先,道歉爲簡單的問題,但它超出了我的技能水平,我已經完成了我的研究,我不能再盯着它。php會話變量通過選擇框更新以顯示/隱藏不同語言的div

我正在構建一個需要以3種不同語言(英語,西班牙語和葡萄牙語)提供的站點,並且這些站點通過右側欄上的選擇輸入來選擇。我有一個js函數顯示/隱藏相關div onchange,但會話變量消失時,我離開了頁面。我也不確定如何讓我保存的顯示/隱藏的div保持狀態,當我改變頁面。所有頁面使用它調用在session_start()

選擇框代碼頭模板:

<div id="languageSelect"> 
<?php 
$_SESSION['language'] = $_POST['languageDropdown']; 
?> 
<form method="post" action="<?php echo $PHP_SELF;?>"> 
    <select name="languageDropdown" id="languageDropdown" class="languageDropdown" onchange="selectLanguage();submit();"> 
     <option name="English" value="English" <?php if (($_SESSION['language'] == '') || ($_SESSION['language'] == 'English')) echo 'selected="selected"'; ?>>English</option> 
     <option name="Español" value="Español" <?php if ($_SESSION['language'] == 'Español') echo 'selected="selected"'; ?>>Español</option> 
     <option name="Português" value="Português" <?php if ($_SESSION['language'] == 'Português') echo 'selected="selected"'; ?>>Português</option> 
    </select> 
    </form> 
</div> 

javascript代碼段(成功改變語言當前頁)

function selectLanguage() { 
if (document.getElementById('languageDropdown').selectedIndex == 0){ 
    $('#nav-en').show(); 
    $('#content-en').show(); 
    $('#nav-es').hide(); 
    $('#content-es').hide(); 
    $('#nav-pt').hide(); 
    $('#content-pt').hide(); 
} 

的方式我已經嘗試解決我的問題是通過在提交會話變量時讓選擇框保持其選項(),然後讓javascript函數讀取哪個選項仍然在頁面加載時被選中並顯示/隱藏相關的div,但沒有這樣的運氣。

$(function(){ 

if (document.getElementById('languageDropdown').selectedIndex == 0){ 
    $('#nav-en').show(); 
    $('#content-en').show(); 
    $('#nav-es').hide(); 
    $('#content-es').hide(); 
    $('#nav-pt').hide(); 
    $('#content-pt').hide(); 
} 
if (document.getElementById('languageDropdown').selectedIndex == 1){ 
    $('#nav-en').hide(); 
    $('#content-en').hide(); 
    $('#nav-es').show(); 
    $('#content-es').show(); 
    $('#nav-pt').hide(); 
    $('#content-pt').hide(); 
} 
if (document.getElementById('languageDropdown').selectedIndex == 2){ 
    $('#nav-en').hide(); 
    $('#content-en').hide(); 
    $('#nav-es').hide(); 
    $('#content-es').hide(); 
    $('#nav-pt').show(); 
    $('#content-pt').show(); 
} 
}); 

我是相當新的PHP,但我做了我的研究,所以任何幫助將不勝感激。

+0

你是什麼意思「會話變量消失」? '$ _SESSION ['language'] = $ _POST ['languageDropdown']' - 也許這行評估它不是一個post請求並將session變量設置爲null? – vbo

+0

@vbo對不起,在那裏模糊。我在我用來測試會話變量的幾頁上有回聲。 \t <?php echo「語言是:」。 $ _SESSION [ '語言']; ?>它會顯示「The Language is:English」,直到我改變頁面。在哪一點它恢復到「語言是:」 – user3122675

+0

好的。那麼會話變量賦值呢?看起來它必須被'if($ _POST)'包圍。 – vbo

回答

1

你可以用下面的代碼創建另一個腳本update-language.php

<?php 

session_start(); 
$_SESSION['language'] = $_GET['languageDropdown']; 

?> 

然後,在你的JavaScript(使用jQuery它看起來像你使用部分),你可以寫:

jQuery(function($){ 
    $("#languageDropdown").change(function(){ 
     $.get("update-language.php",{languageDropdown:$(this).val()}); 
    }); 
}); 

這不會像您正在嘗試的那樣重新加載頁面,但它會加載新腳本,它將更新會話變量,以便在頁面重新加載時識別新選擇的語言。

jQuery中的$.get()命令將通過AJAX加載腳本,以便您不需要頁面刷新。

下面是完整的代碼,我有測試過它:

的index.php

<?php session_start(); 
if($_SESSION['language'] == '') $_SESSION['language'] = "English"; 
?> 
<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>Change Language</title> 
    </head> 
    <body> 

      <div id="languageSelect"> 
       <p>Your current language is: 
        <select name="languageDropdown" id="languageDropdown" class="languageDropdown"> 
       <option name="English" value="English" <?php if ($_SESSION['language'] == 'English') echo 'selected="selected"'; ?>>English</option> 
       <option name="Español" value="Español" <?php if ($_SESSION['language'] == 'Español') echo 'selected="selected"'; ?>>Español</option> 
       <option name="Português" value="Português" <?php if ($_SESSION['language'] == 'Português') echo 'selected="selected"'; ?>>Português</option> 
        </select> 
       </p> 
      </div> 

      <nav id="nav-en" <?php if ($_SESSION['language'] != 'English') echo 'style="display:none"'; ?>><a href="#link">English Navigation</a></nav> 
      <nav id="nav-es" <?php if ($_SESSION['language'] != 'Español') echo 'style="display:none"'; ?>><a href="#link">Español Navigation</a></nav> 
      <nav id="nav-pt" <?php if ($_SESSION['language'] != 'Português') echo 'style="display:none"'; ?>><a href="#link">Português Navigation</a></nav> 

      <section id="content-en" <?php if ($_SESSION['language'] != 'English') echo 'style="display:none"'; ?>> 
       <h1>English Content</h1> 
      </section> 
      <section id="content-es" <?php if ($_SESSION['language'] != 'Español') echo 'style="display:none"'; ?>> 
       <h1>Español Content</h1> 
      </section> 
      <section id="content-pt" <?php if ($_SESSION['language'] != 'Português') echo 'style="display:none"'; ?>> 
       <h1>Português Content</h1> 
      </section> 

      <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
     <script type="text/javascript"> 
     jQuery(function($){ 

     $("#languageDropdown").change(function(){ 

      //update the language session 
      $.get("update-language.php",{languageDropdown:$(this).val()}); 

      //change the current interface language 
      $("#content-en, #content-es, #content-pt, #nav-en, #nav-es, #nav-pt").hide(); 
      if($(this).val() == "English") 
       $("#content-en, #nav-en").show(); 
      else if($(this).val() == "Español") 
       $("#content-es, #nav-es").show(); 
      else if($(this).val() == "Português") 
       $("#content-pt, #nav-pt").show(); 

     }); 

     }); 
     </script> 

    </body> 
</html> 

更新language.php

<?php 

session_start(); 
$_SESSION['language'] = $_GET['languageDropdown']; 

?> 

有更簡單的方法建立一個這樣的小語言系統,但這完全是另一個討論。希望這個解決方案適合您的需求和您已有的代碼。

+0

感謝您的答覆,我已經實現了您的解決方案,但回聲顯示沒有會話變量。我對Ajax完全沒有經驗。我很高興能以最簡單的方式實現這一點,因爲該網站的複雜性不太可能增長。我只需要獲取會話變量以在頁面之間保持其值,然後我可以從中找出它。 – user3122675

+0

對不起,你無法得到最初的答案工作。根據我的建議,我已經提供了一些完整的(工作)代碼,這些代碼應該可以在上面編輯的答案中實現。 – scottsanders

+0

非常感謝您的努力Scott。我能夠實現一個沒有AJAX的混亂的解決方案,但我一定會得到這個工作。非常感激 – user3122675