Как вывести значение из textarea в js

159

15 ноября 2019, 16:20

Работою с API SpeechSynthesis, хочу сделать так, чтобы из textarea брался вводимый текст пользователем и с помощью button прослушивался, вопрос в чём моя ошибка?

var text = document.getElementById('text'); 
var msg = text.value; 
text.value =""; 
var synth = window.speechSynthesis; 
var utterance = new SpeechSynthesisUtterance(msg); 
 
function talk() { 
    speechSynthesis.speak(utterance); 
}

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
    <title>Читалка</title> 
</head> 
<body> 
    <p>Введите текст:</p> 
    <textarea name="text" id="text" cols="30" rows="10"></textarea><br> 
    <button onclick="talk()">Прослушать</button> 
    <script src="js/script.js"></script> 
</body> 
</html>

Answer 1

function talk() { 
  var text = document.getElementById('text'); 
  var msg = text.value; 
  //text.value = ""; 
  //var synth = window.speechSynthesis; 
  var utterance = new SpeechSynthesisUtterance(msg); 
  if (document.getElementById("russian").checked) 
    utterance.lang = "ru-RU"; 
  speechSynthesis.speak(utterance); 
}

<p>Введите текст:</p> 
<textarea name="text" id="text" cols="30" rows="5"> 
A B C D E 
 
Наша Таня громко плачет 
</textarea><br> 
<label><input type="checkbox" id="russian" />Русский язык<label> 
<button onclick="talk()">Прослушать</button>

Answer 2

Функция talk находится в области видимости недоступной из html. Для её вызова необходимо определить функцию как член document:

var text = document.getElementById('text'); 
var msg = text.value; 
text.value =""; 
var synth = window.speechSynthesis; 
var utterance = new SpeechSynthesisUtterance(msg); 
 
document.talk = function() { 
    alert('ok'); 
    speechSynthesis.speak(utterance); 
}

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
    <title>Читалка</title> 
</head> 
<body> 
    <p>Введите текст:</p> 
    <textarea name="text" id="text" cols="30" rows="10"></textarea><br> 
    <button onclick="talk()">Прослушать</button> 
    <script src="js/script.js"></script> 
</body> 
</html>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

JWT ASP.Net Core Web API

я знакомлюсь с Jason Web Tokens и не могу найти толковую литературу, которая помогла бы мне в этомБыл бы невероятно признателен, если бы таковую кто...

147

Объясните почему ошибка [закрыт]

Не могу понять почему это не работает, ведь kt1 и kt2 присвоился тип double и метод math возвращает переменной hypot double так почему же программа выводит...

187

github авторизация state Exceptions

Startup:

146

Ошибка MonoGame Visual Studio

monogame Отсутствует подтип проектаПодтип "{6D335F3A-9D43-41b4-9D22-F6F17C4BE596}" не поддерживается в этой копии программы

164