4

あなたの助けを借りて、入力値に即座に反応するajax関数ができました。(送信ボタンを AJAX 関数で変更して、入力に即座に反応するようにします)

この関数は、入力された数字の単語をロシア語で表示します。ここで、単語をクリックして単語を発音する再生アイコンを単語の左側に追加したいと思います。

Google TTS (Text-to-Speech) で解決策を見つけましたが、私の例では Google Chrome でしか機能しません。IE と Firefox (最新バージョン) は動作しません。

別の問題: 1. この関数は最大 100 文字の発音を許可するため、スクリプトは大きな入力 (>100 文字) を複数の連続した例の要求に分割し、可能な最大数 999999999999999 を求める必要があります。

4

1 に答える 1

1

引き続き、ajax (通常のプロセス) が機能するようになったので、テスト サイトで行ったのと同じ方法で実装します。次の例を検討してください。

<form method="POST" action="index.php">
    <label for="zahl">Zahl:</label> <br/>
    <input id="zahl" name="zahl" type="number" size="15" maxlength="15"><br/><br/>
    <img src="http://lern-online.net/bilder/symbole/play.png" id="playsound" style="display: none;  " />
    <span id="results" style="width: 400px;"></span> <!-- results appear here -->
</form>
<div class="player"></div>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<!-- <script src="jquery.min.js"></script> -->
<script type="text/javascript">
$(document).ready(function(){

    $('#zahl').on('keyup', function(){
        var input = $(this).val(); 
        if(input != '') {
            // ajax request server
            $.ajax({ url: 'index.php', type: 'POST', dataType: 'text', data: {value: input},
                success: function(response) {
                    $('#results').text(response); // append to result div
                    $('#playsound').show();
                }
            });  
        } else {
            $('#results').text('');
            $('#playsound').hide();
        }

    });

    // add this, since it spawns new embed tags every click
    $('#playsound').click(function(){
        var input = encodeURIComponent($('#results').text());
        $('.player').html('<audio controls="" autoplay="" name="media" hidden="true" autostart><source src="sound.php?text='+input+'" type="audio/mpeg"></audio>');
    });

});
</script>

サウンド リクエストを処理する新しい php ファイルを作成します。

あれを呼べsound.php

<?php

$txt = $_GET['text'];
$txt = urlencode($txt);
header("Content-type: audio/mpeg");
$url ="http://translate.google.com/translate_tts?q=$txt&tl=ru&ie=UTF-8";
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_TIMEOUT, 30);
$audio = curl_exec($ch);
echo $audio;

?>
于 2014-06-22T02:24:24.043 に答える