Question

我是jQuery的新手。这段代码可以让我在html中更改文本：

// Some variables for later
var dictionary, set_lang;

// Object literal behaving as multi-dictionary
dictionary = {
    "english": {
        "_hello": "Hello",
        "_january": "January"
    },
    "portuguese": {
        "_hello": "Oie",
        "_january": "Janeiro"
    },
    "russian": {
        "_hello": "привет",
        "_january": "январь"
    }
};

$(function () {

    // Lets be professional, shall we?
    "use strict";

    // Function for swapping dictionaries
    set_lang = function (dictionary) {
        $("[data-translate]").text(function () {
            var key = $(this).data("translate");
            if (dictionary.hasOwnProperty(key)) {
                return dictionary[key];
            }
        });
    };

    // Swap languages when menu changes
    $("#lang").on("change", function () {
        var language = $(this).val().toLowerCase();
        if (dictionary.hasOwnProperty(language)) {
            set_lang(dictionary[language]);
        }
    });

    // Set initial language to English
    set_lang(dictionary.english);

});

1-我想改进同样的代码来改变一些图像（src），我该怎么做？

2-是否可以简化此代码？新手很难理解这种代码：函数内的函数......呃!!! （有很多东西需要研究）

提前致谢。

P.S。这是原帖的链接： jQuery language switcher

我相信这样的事情可以解决问题：

// Some variables for later
var dictionary, set_lang;

// Object literal behaving as multi-dictionary
dictionary = {
    "english": {
        "_hello": "Hello",
        "_january": "January"
        "_imgSrc": "myStuff/img/imageEn.png" //added as a example to image change
    },
    "portuguese": {
        "_hello": "Oie",
        "_january": "Janeiro"
        "_imgSrc": "myStuff/img/imagePt.png" //added as a example to image change
    },
    "russian": {
        "_hello": "привет",
        "_january": "январь"
        "_imgSrc": "myStuff/img/imageRu.png" //added as a example to image change
    }
};

$(function () {

    // Lets be professional, shall we?
    "use strict";

    // Function for swapping text
    set_lang = function (dictionary) {
        $("[data-translate]").text(function () {
            var key = $(this).data("translate");
            if (dictionary.hasOwnProperty(key)) {
                return dictionary[key];
            }
        });
    };

    // Function for swapping images
        set_lang = function (dictionary) {
            $("[src-translate]").attr("src") === function () {  //here is the problem, how to implement this?
                var key = $(this).data("translate");
                if (dictionary.hasOwnProperty(key)) {
                    return dictionary[key];
                }
            });
        };

    // Swap languages when menu changes
    $("#lang").on("change", function () {
        var language = $(this).val().toLowerCase();
        if (dictionary.hasOwnProperty(language)) {
            set_lang(dictionary[language]);
        }
    });

    // Set initial language to English
    set_lang(dictionary.english);

Answer 1

我找到了一种让它按照我想要的方式工作的方法：

＆＃13;

$(function () {

    // Lets be professional, shall we?
    "use strict";

    // Some variables for later
    var dictionary, set_lang;

    // Object literal behaving as multi-dictionary
    dictionary = {
        "english": {
            "_hello": "Hello",
            "_january": "January"
        },
        "portuguese": {
            "_hello": "Oie",
            "_january": "Janeiro"
        },
        "spanish": {
            "_hello": "¡Hola",
            "_january": "Enero"
        }
    };

    // Function for swapping dictionaries
    set_lang = function (dictionary) {
        $("[data-translate]").text(function () {
            var key = $(this).data("translate");
            if (dictionary.hasOwnProperty(key)) {
                return dictionary[key];
            }
        });
    };

    // Swap languages when menu changes
    $("#lang").on("change", function () {
        var language = $(this).val().toLowerCase();
           if (language == "portuguese") {
        $("#Bot").attr("src", "my_stuff/img/LogoPt.png").attr("alt", "Portuguese")
     
        } else
            if (language == "english") {
        $("#Bot").attr("src", "my_stuff/img/LogoEn.png").attr("alt", "English")
        
        } else
            if (language == "spanish") {
        $("#Bot").attr("src", "my_stuff/img/LogoEs.png").attr("alt", "Spanish")
       
        }
        if (dictionary.hasOwnProperty(language)) {
            set_lang(dictionary[language]);
        }
    });

    // Set initial language to English
    set_lang(dictionary.english);

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select id="lang">
    <option>English</option>
    <option>Portuguese</option>
    <option>Spanish</option>
</select>
<span data-translate="_hello">Hello</span>, 
<span data-translate="_january">January</span>!
<br>
<br>
<img id="Bot" src="my_stuff/img/Logo.png" class="img-circle img-responsive" alt="english">

＆＃13;

感谢您的朋友们。

jQuery语言切换器文本和图像

1 个答案: