Google Translate, testo segnaposto in input type = 'text'

Question

Problema traduzione testo segnaposto in input type="text"

Questo è il mio codice di esempio:

Html:

<div id="google_translate_element" style="float:left; padding-left:15px"></div> 


<!-- Need to translate this placeholder text --> 

<form><input type="text" placeholder= "Enter your name" /> 
<input type="submit" value="Submit" /> 
</form> 

JavaScipt:

<script type="text/javascript"> 
function googleTranslateElementInit() { 
     new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'ca,da,de,el,en,es,fr,it,ja,ko,nl,pl,pt,ru,sv,tl', 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> 

CSS:

<style> 
div#google_translate_element div.goog-te-gadget-simple{background-color:green;} 
    div#google_translate_element div.goog-te-gadget-simple a.goog-te-menu-value span{color:yellow} 

    div#google_translate_element div.goog-te-gadget-simple a.goog-te-menu-value span:hover{color:#ffffff} 
</style> 

translater esempio è in

JSFiddle:

http://jsfiddle.net/ulak/zDUYL/

preghiamo di ricordare qualsiasi altro modo per tradurre il testo segnaposto utilizzando Google Translate

Answer 1

Finché Google Translate non vuole tradurre un attributo placeholder (e non suggeriscono alcun modo di richiederlo), la risposta è "non puoi".

Come soluzione alternativa, è possibile inserire il testo segnaposto in un elemento normale, ad esempio un elemento label e, successivamente, con JavaScript, copiare il contenuto in un attributo placeholder ed eliminare l'elemento normale.

Tuttavia, è molto meglio per evitare di creare il problema e semplicemente utilizzare un elemento label anziché l'attributo placeholder in una situazione in cui si usa il secondo nel ruolo di un'etichetta - contro l'HTML5 CR che chiaramente says: "L'attributo segnaposto non deve essere utilizzato come sostituto di un'etichetta.". Quindi, è sufficiente utilizzare markup normale e lo hanno normalmente (MIS) tradotta da Google:

<label for=name>Your name:</label> <input type="text" id=name> 

Answer 2

<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> 

Answer 3

Come risposta precedente, Google Translator non si traduce segnaposto

Mentre googling, ha trovato questo javascript soluzione e lo fa lavoro. http://gamon.org/blog/2015/03/12/translate-placeholders-with-google-translate-widget/

jsfiddle in here

// Find all placeholders 
var placeholders = document.querySelectorAll('input[placeholder]'); 

if (placeholders.length) { 
    // convert to array 
    placeholders = Array.prototype.slice.call(placeholders); 

    // copy placeholder text to a hidden div 
    var div = $('<div id="placeholders" style="display:none;"></div>'); 

    placeholders.forEach(function(input){ 
     var text = input.placeholder; 
     div.append('<div>' + text + '</div>');  
    }); 

    $('body').append(div); 

    // save the first placeholder in a closure 
    var originalPH = placeholders[0].placeholder; 

    // check for changes and update as needed 
    setInterval(function(){ 
     if (isTranslated()) { 
     updatePlaceholders(); 
     originalPH = placeholders[0].placeholder; 
     } 
    }, 500); 

    // hoisted --------------------------- 
    function isTranslated() { // true if the text has been translated 
     var currentPH = $($('#placeholders > div')[0]).text(); 
     return !(originalPH == currentPH); 
    } 

    function updatePlaceholders() { 
     $('#placeholders > div').each(function(i, div){ 
     placeholders[i].placeholder = $(div).text(); 
     }); 
    } 
} 

Answer 4

<div id="google_translate_element"></div> 
<script type="text/javascript"> 
    function googleTranslateElementInit() { 
     new google.translate.TranslateElement({ 
      pageLanguage: 'en', 
      includedLanguages: 'ar', 
      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>