CHUYỂN ĐỔI NGÔN NGỮ CHO WEBSITE

     

Hiện nay, đa ngôn ngữ là một tính năng tương đối phổ biến. Bạn có thể bắt chạm mặt việc biến đổi ngôn ngữ trong điện thoại cảm ứng thông minh hoặc các website (như www.intel.com). Ta gồm nhiều cách để implement tài năng này.

Bạn đang xem: Chuyển đổi ngôn ngữ cho website

Đa ngữ điệu (Multi Language)thường được áp dụng trên website nhằm mục đích mục đích biểu đạt thông tin trải qua không ít loại ngữ điệu để tăng tính tiếp cận đối với thông tin đó. Đa ngôn ngữ cũng có rất nhiều phương thức thực hiện. Vào chuỗi bài viết này bản thân sẽ trình làng hai cách tiến hành để implement anh tài đa ngữ điệu cho website kia làĐa ngữ điệu sử dụng JavaScriptĐa ngôn từ sử dụng .NET Resource.

Trong bài viết này sẽ reviews phương thức implementĐa ngôn từ sử dụng JavaScript. Thực chất là Đa ngôn từ sử dụng JavaScript với file JSON, mà thôi dài loại quá cần rút giảm lại cho nó ngắn gọn:)

Thiết kế giao diện

Đầu tiên ta thiết kế giao diện cơ phiên bản của một trang đăng nhập, bởi vì có anh tài đa ngôn từ nên ta đang gắn thêm 2 lá cờ English với Vietnam. Đoạn code html như sau:

*

Và đó là giao diện ta tất cả được.

*

Chém thôi, đánh hệt nhau như trên ko ra tương tự vậy được đâu. Các bạn phải thêm css, bootstrap các kiểu nữa, dẫu vậy mà muốn reviews về nó thì đề nghị viết một bài khác, trong phạm vi bài viết này chỉ chú trọng tới ngôn từ hiển thị là được.

Tạo cỗ từ điển cho các ngôn ngữ tương ứng

Tiếp theo ta bắt buộc một cỗ từ điển để website hiểu rằng nội dung đề nghị hiển thị ứng cùng với từng loại ngôn ngữ. Ví dụ như chữ trong nút Login so với tiếng Anh làLogin, đối với tiếng Việt làĐăng nhậpchẳng hạn.

Bộ trường đoản cú điển sẽ tiến hành chứa trong tệp tin JSON cùng được đặt trong thư mụclang. Cách tổ chức triển khai thư mục như sau:

*

Nội dung file là những key và nội dung của key đó khớp ứng với ngôn ngữ.

Xem thêm: Thvl - Nguyễn Thị Thu Hằng

*
*

Bây giờ ta thêm các keyvào từng thẻ hiển thị ngôn từ tương ứng bằng cách thêm trực thuộc tínhlangKey.

Ta cũng tạo nên thêm input đầu vào cóid="langCode"dùng để cất mã ngôn ngữ cần chuyển đổi (ở trên đây ta có 2 mã làenvàvi)

*

Ta yêu cầu tạo tệp tin JavaScript có tác dụng nhiệm vụ biến đổi ngôn ngữ cho hầu như thẻ chứalangKeytrên, đánh tên làlang.js

Mã ngôn ngữ mặc định là en nhằm tránh lỗi trong trường hợp$("#langCode")không có mức giá trị.

var langCode = $("#langCode").val() || "en";var jsonUrl = "../Content/lang/" + langCode + ".json";var translate = function (jsdata) $("").each(function (index) var strTr = jsdata<$(this).attr("langKey")>; $(this).html(strTr); $(this).attr("placeholder", strTr); );$.ajax( url: jsonUrl, dataType: "json", async: false, success: translate);Về cơ bản thì code Đa ngữ điệu bằng JavaScript sẽ hoạt động. Hiện nay ta cách xử trí sự kiện bấm vào 2 lá cờ để thay đổi giá trị cho$("#langCode")

Xử lý sự kiện

Đầu tiên ta chế tạo RouterConfig nội dung sau

*

Sau kia ta thêm actionChangeCulturevàoHomeController

Cũng vào Controller này ta gán giá trị mặc định cho mã ngôn ngữ khi lần đầu truy cập website. Trong ví dụ dưới ta gán mã ngữ điệu mặc định là en

*

Cuối cùng làtạo thêm hyperlink trỏ tới actionChangeCulturecho 2 lá cờ phía trên

*

À ghi nhớ thêm những thư viện jquery nữa nhé.

Kết quả ta thu được khi nhấp vào lá cờ Vietnam.

Xem thêm: Cách Nạp Tiền Zalo Pay Bằng Thẻ Cào Điện Thoại Nhanh Nhất, Cách Nạp Tiền Vào Zalopay Bằng The Cào

*

Tạm kết

Như vậy, bài viết đã cung ứng một thủ tục implement nhân kiệt Đa ngữ điệu cho Website bằng phương pháp sử dụng JavaScript. Đây là giải pháp khá dễ dàng và nhìn cũng rất là củ chuối, thích hợp cho những trang nhỏ, buộc phải làm nhanh, không yên cầu quá chặt chẽ.

Bài viết sau mình sẽ ra mắt phương thức sản phẩm công nghệ hai kia làĐa ngôn ngữ sử dụng .NET Resource