Text to speech na stronie www

Dla specjalistów Programowanie
#1

Witam,
mam kłopot, bo chcę zrobić sobie stronkę z fraszkami i móc je odczytywać przez translator.
Pomimo, że z bazy są czytane wyrazy, to czytany przez translator jest tylko pierwszy, czy ktoś mógłby pomóc ?

 

<html>

    <body>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

    <script>

            $(function() {

                $('a.say').on('click', function(e) {

                    e.preventDefault();

                    var text = $('input[name="text"]').val();

                    text = encodeURIComponent(text);

                    console.log(text);

                    var url = 'https://ssl.gstatic.com/dictionary/static/sounds/de/0/' + text + '.mp3';

                    $('audio').attr('src', url).get(0).play();

                });

            });

        </script>

     

    <?php

    try

       {

          $pdo = new PDO('mysql:host=localhost;dbname=fiszki', 'testowy', 'testowy');

          $stmt = $pdo->query('SELECT * FROM slowa');

          foreach($stmt as $row)

          {

    		$en = $row['en'];

     

    		 echo "<input type=text name=$en value=$en /><a href=# class=say>słuchaj</a>"."<br />";

    		  echo "<audio src= class=speech hidden></audio>";

     

          }

          $stmt->closeCursor();

       }

       catch(PDOException $e)

       {

          echo 'Połączenie nie mogło zostać utworzone: ' . $e->getMessage();

       }

    ?>

    </body>

    </html>

 

#2

Nie odczytujesz podrzędnego, a jeden z istniejących

#3

Próbowałem robić w ten sposób ale wówczas czyta tylko ostatni.

var text = $(‘input[name="$en"]’).val();