Переводчик jQuery

#javascript #html #jquery

#javascript #HTML #jquery

Вопрос:

Я хочу перевести слова в пиратские слова.

Итак, этот код устроен так, что он пытается перевести слова из поля в функцию, которая должна преобразовать слова в «пиратский» перевод, но он не показывает перевод. Пожалуйста, скажите мне, как искать ошибки или начать отладку этого кода, который я вообще не понимаю.

 <html lang="en">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  <!-- CC BY-NC-ND https://responsivevoice.org/ -->
  <script src='https://code.responsivevoice.org/responsivevoice.js'></script>
  
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>
</head>
<body>
  
  <h2>Normal</h2>
  <textarea id="normal"></textarea>

  <h2>Pirates</h2>
  <textarea id="pirate"></textarea>

  <p>
    
    <input onclick='speak()' type='button' value='🔊 Talk like a pirate' />
    <script>
      $(document).ready(function(){
        $("#normal").keyup(function(){

          var r = $("#normal").val();
          
          let c = 'bcdfghjklmnpqrstvwxz';
          for(let letter of r){
            let smallLetter = letter.toLowerCase();
            r = r   letter;
            if(c.includes(smallLetter)){
              
              r = r   'o'   smallLetter;  
              
              
            }
          }
          return r;

          words = words.replace(r);
          $("#pirate").val(r);

        });
      });

      function speak(){
        var text = $("#pirate").val();
        responsiveVoice.speak(text);
      }
      
    </script>

  </body>
  </html>


 

Комментарии:

1. удалите return r; из своего кода. Это завершает вашу функцию, и вы не можете распечатать свои вновь созданные слова для #pirate ввода.

2. он все еще не работает, когда я убрал это D:

3. Теперь он печатает слова, которые я пишу, И перевод сразу после этого. Итак, это работает, но мне нужно получить слова, которые я пишу оттуда xD

4. Можете ли вы предоставить свой код в codepen или jsfiddle без запросов Speech API.

5. Конечно! codepen.io/MrLowBot/pen/zYKGMMP

Ответ №1:

В строке # 35 вы добавляете свой объединенный результат ко всему значению.

 r = r   letter;

 

Вероятно, вам следует использовать новую переменную для вашего конечного результата и пусть r будет переменной только для исходного текста.

Ответ №2:

Во-первых, я удалился return r; . Это завершало вашу функцию, и вы не могли распечатать свои вновь созданные слова для #pirate ввода.

Во-вторых, вы использовали ту же переменную для хранения ваших изменений, r = r letter; и r = r 'o' smallLetter . Я изменил их с помощью новой переменной, имя которой в начале функции равно d, и вернул ее.

Примечание: я удалил ваш Speech API из ответа.

 $(document).ready(function(){
    $("#normal").keyup(function(){

        var r = $("#normal").val();
      let d= "";
          let c = 'bcdfghjklmnpqrstvwxz';
          for(let letter of r){
            let smallLetter = letter.toLowerCase();
            d = d   letter;
            if(c.includes(smallLetter)){

              d = d   'o'   smallLetter;  
           }
          }

        $("#pirate").val(d);

    });
}); 
 <!-- Av Karwan Maryame Azar.-->


<html lang="en">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>
</head>
<body>
  
  <h2>Normal</h2>
<textarea id="normal"></textarea>

<h2>Pirates</h2>
<textarea id="pirate"></textarea>

<p>
  
<input type='button' value='🔊 Talk like a pirate' />
  

</body>
</html> 

Комментарии:

1. Как я смогу добавить свой текст в речь? Я попытался добавить его, но он не хочет работать … codepen.io/MrLowBot/pen/zYKGMMP

2. @MrLowBot Он отлично работает в codepen с преобразованием текста в речь.