2012-10-15 23 views
7

Tôi đang sử dụng google dịch widget trên một trong những trang web của tôi với google sau cung cấp mã:Google Translate Widget - Dịch thuật hoàn thành callback

<div id="google_translate_element"></div><script type="text/javascript"> 
function googleTranslateElementInit() { 
    new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element'); 
} 
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script> 

<script> 

Vấn đề của tôi: Các dịch chạy sau khi trang đã được nạp nhưng tôi cũng có một tập lệnh tự động định kích thước các phần tử điều hướng chính của tôi dựa trên chiều rộng của chúng.

Thao tác này chạy trước khi bản dịch kết thúc để nó thay đổi kích thước dựa trên các nhãn tiếng Anh chưa được dịch. Khi bản dịch đã thay đổi từ ngữ điều hướng, các thành phần điều hướng cần phải được thay đổi kích thước để phù hợp với các từ mới được dịch vì chúng có thể có kích thước khác nhau (chiều rộng) với tiếng Anh.

Tôi đã thử gọi mã Google dịch trước khi tôi chạy mã để thay đổi kích thước điều hướng chính nhưng bản dịch chạy không đồng bộ để mã của tôi chạy trước khi dịch hoàn tất.

Có sự kiện gọi lại được nâng lên khi bản dịch hoàn thành (hoặc một số cách để phát hiện khi bản dịch hoàn tất), vì vậy tôi có thể đợi trước khi tôi cố định lại kích thước điều hướng?

Ngoài ra, tôi cần chạy tập lệnh SAU KHI trang đã dịch xong.

+0

Tôi không có bất kỳ nội dung ví dụ nào nhưng bạn có thể thử thêm một cuộc gọi hàm trong googleTranslateElementInit ..? I E. function googleTranslateElementInit() { new google.translate.TranslateElement (...); myFuncInvocation(); } – EricG

+0

Đã thử rằng Eric, cùng một vấn đề với việc gọi google dịch trước mã của tôi. Nó chạy không đồng bộ để trả về từ cuộc gọi google.translate.TranslateElement() ngay lập tức (tức là trước khi bản dịch kết thúc) - Tôi sẽ cập nhật câu hỏi của mình – RichardAtHome

+0

Thành thật mà nói tôi muốn xem một ví dụ mà nó chạy. Những gì bạn có thể làm là đặt điểm ngắt trong 'google.translate mới' trong webkit và thử gỡ lỗi và xem liệu bạn có thể thêm trình xử lý hoặc trình xử lý hiện có mặc định tùy chọn có thể được gọi hay không. – EricG

Trả lời

6

Dưới đây là sửa chữa tôi đã kết thúc bằng:

jQuery(function(){ 
    firstMenu = $("#nav li:first").text(); 

    setTimeout(waitNav, 500); 
}); 

function waitNav() { 

    if (firstMenu != $('#nav li:first').text()) { 

     initNav(); 
     firstMenu = $('#nav li:first').text(); 
     setTimeout(waitNav, 500); 

    } 
    else { 
     setTimeout(waitNav, 500); 
    } 

} 

Về cơ bản, liên tục kiểm tra nếu một mảnh tiếng của văn bản đã thay đổi (trong trường hợp này đó là mục đầu tiên trong khối navigation).

Nếu thay đổi có nghĩa là người dịch đã chạy, hãy chạy mã bạn cần chạy sau khi dịch (initNav() tại đây).

Tôi tiếp tục kiểm tra các thay đổi trong trường hợp người dùng chọn ngôn ngữ khác.

Đó không phải là hoàn hảo, nhưng nó làm việc cho tôi :-)

+1

Lưu ý: trong rất nhiều trường hợp, một đoạn văn bản (đặc biệt là các mục menu) có thể không thay đổi sau khi dịch: "contact" có thể đánh vần giống nhau Anh. Không chắc chắn nếu lừa này sẽ làm việc sau đó. – frnhr

0

Bạn có thể phát hiện những thay đổi như thế này:

$('#some-translatable-element').bind('DOMSubtreeModified', function() { 
    yourCallback(); 
}); 

Nhược điểm là sự kiện được beeing bắn nhiều lần kể từ google dịch không nhiều thay đổi trong quá trình.

Đề xuất là để phát hiện các thay đổi trên thành phần cuối cùng trên trang của bạn, do đó bạn biết tất cả các yếu tố trên được dịch.

+1

Có cách nào thông minh để có ngôn ngữ được chọn không ??? –