Question

我使用下面的代码按类显示/隐藏div，这样当选择语言时，只有正确的div可见。

使用单选按钮选择语言时，此方法正常，但是当新页面加载到iframe时，语言首选项不会应用于该页面。我正在尝试使用sessionStorage，并且已经将参数传递给iframe中新加载的页面：

这在index.html中改变开关时改变当前加载页面中的显示/隐藏：

<script>
function setlang(lang) {
    var i;
    var len;
    var list;
    var ifr = document.getElementById('mainframe');
    var cw = (ifr.contentWindow || ifr.contentDocument);

    list = cw.document.getElementsByClassName('langdiv');

    for (i=0, len=list.length ; i<len ; i++){
        list[i].style.display = 'none';
        }

    list = cw.document.getElementsByClassName(lang);

    for (i=0, len=list.length ; i<len ; i++){
        list[i].style.display = 'block';
        }
}

</script>

这在index.html正文中应用新语言并将其保存到sessionStorage：

    <div class="switch">
            <input id="english" name="view" type="radio" checked onclick="setlang('EN'); sessionStorage.setItem('language', 'EN');">
            <input id="deutsch" name="view" type="radio" onclick="setlang('DE'); sessionStorage.setItem('language', 'DE');">    
            <input id="francais" name="view" type="radio" onclick="setlang('FR'); sessionStorage.setItem('language', 'FR');">   
            <input id="italiano" name="view" type="radio" onclick="setlang('IT'); sessionStorage.setItem('language', 'IT');">   
    </div>

<div id="iframe"><iframe name="mainframe" id="mainframe" src="home.html"></iframe></div>

...在给定的iframe中，我检索sessionStorage参数（此代码仅用于确保它正常工作 - 我不需要显示sessionStorage参数：

<script>
    window.onload=function applylanguagechoice() {
        if(typeof(Storage) !== "undefined") {
        document.getElementById("language").innerHTML = "SELECTED LANGUAGE=" +           sessionStorage.language;
        } 
    }
</script>

相反，我需要使用它来显示/隐藏正确的div类，这些类在iframe中组织如下：

   <div class="EN languid">Hello</div>
   <div class="DE languid">Guten Tag</div>
   <div class="FR languid">Bonjour</div>
   <div class="IT languid">Ciao</div>

就像现在一样，我有以下（我的估计非常笨拙）代码从sessionStorage获取值：

<script>
    $(document).ready(function(){
        var selectedlanguage = sessionStorage.getItem("language");

        if (selectedlanguage == 'EN') {
            $('.EN').show();
            $('.DE').hide();
            $('.FR').hide();
            $('.IT').hide();
            } 

        if (selectedlanguage == 'DE') {
            $('.EN').hide();
            $('.DE').show();
            $('.FR').hide();
            $('.IT').hide();
            } 

        if (selectedlanguage == 'FR') {
            $('.EN').hide();
            $('.DE').hide();
            $('.FR').show();
            $('.IT').hide();
            } 

        if (selectedlanguage == 'IT') {
            $('.EN').hide();
            $('.DE').hide();
            $('.FR').hide();
            $('.IT').show();
            } 
    });
</script>

任何人都可以帮助我更好地采用sessionsStorage参数并将其应用于隐藏/显示divs吗？

谢谢！

javascript - 将语言选择传达给iframe

0 个答案: