Jquery div 从 PHP 填写只是重定向到 PHP 页面？

Question

我正在尝试从循环 PHP 变量中提取一个字符串，并在它使用 jQuery.

更新到 div 时加载它

问题是，它只是在满足条件时将我重定向到 PHP 页面，而不是从中提取信息并将该信息放入主 html 的 div 中] 页。

我也在尝试将 div 中的字符串放入 JavaScript 函数中 responsiveVoice.speak("string"); 但这也不起作用。

我尽量让我的问题的格式尽可能清楚，并且我已经按照我最好的理解遵循了堆栈溢出建议。我试图提出很好的问题，但过去我提出的其他问题并没有受到好评。

编辑：修复了结束脚本标签和正文标签的位置。它不再有重定向到 PHP 页面的问题，但它仍然不是运行 TTS。它有一个新问题；它不是根据更改刷新单个回显，而是一遍又一遍地打印回显。

这是 index.html 文件：

<html>
    <head>
    </head>
    <body>

        <script src="http://code.responsivevoice.org/responsivevoice.js"></script>
        <script>
            var speek = document.getElementById("load_updates");
            responsiveVoice.speak(speek);
        </script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
        <script type="text/javascript">
            var auto_refresh = setInterval(
            function ()
            {
                $('#load_updates').load('new3.php').fadeIn("slow");
            }, 10000); // refresh every 10000 milliseconds
         </script>

                <div id="load_updates"></div>


    </body>
</html>

这是后台循环 new3.php 文件：

<?php 
    for($z=0;$z<2880;$z++) {                
        $frog = "15";
        $tent = "2";            
        if ($frog >= $tent) {
            echo "+ frog!";
            echo  "tent";
            $sayit = "Hello! plus frog tent";               
        }   
    }  
?>

为了简洁起见，我删除了 PHP 循环中发生变化的部分。

Answer 1

根据 ResponsiveVoice.JS API，speak 方法采用字符串参数（以及可选的语音和选项参数）。

SPEAK(STRING TEXT, [STRING VOICE], [OBJECT PARAMETERS])

Starts speaking the text in a given voice.
_{text: String

The text to be spoken.

voice: String

Defaults to “UK English Female”. Choose from the available ResponsiveVoices.

parameters: Object

Used to add optional pitch (range 0 to 2), rate (range 0 to 1.5), volume (range 0 to 1) and callbacks.

Pitch, rate and volume may not affect audio on some browser combinations, older versions of Chrome on Windows for example.} ¹

您示例中的代码正在传递对 DOM 元素（即 var speek = document.getElementById("load_updates");）的引用。传递该元素的文本内容，使用 .innerHTML, .text()，等等

所以这一行：

responsiveVoice.speak(speek);

可以更新为：

responsiveVoice.speak(speek.innerHTML);

或与 jQuery 方法保持一致：

responsiveVoice.speak($(speek).text());

这也可以简化为以下内容，这将使上面的行变得不必要：

responsiveVoice.speak($('#load_updates').text());

请参阅 this PHPFiddle 中的演示 - 只需单击标记为“运行 - F9”的按钮。

phpFiddle 上的演示示例使用相同的文件名发送异步请求（即 $('#load_updates').load('），因为在 phpfiddle 上似乎不可能有多个文件。

它还利用 $(document).ready() to ensure the DOM is ready before the code starts interacting with elements from it. Also notice that the call to .load() 调用函数 speakInnerHTML() 作为第二个参数传递，以便在加载新文本后朗读新文本.

更新：

由于当对象作为第二个参数传递时 .load() 将请求作为 POST 发送，我更新了 phpFiddle 上的示例以传递一个简单的对象。

$('#load_updates').load('<?php echo $_SERVER['PHP_SELF'];?>', {postData: 1}, speakInnerHTML).fadeIn("slow");

然后在 PHP 代码中，检查 POST 数据：

if (isset($_POST['postData'])) {
    echo date('Y-m-d h:i:s');

¹_{https://responsivevoice.org/api/}

Jquery div 从 PHP 填写只是重定向到 PHP 页面？

Jquery div fill from PHP just redirects to PHP page?

javascript

php

jquery

html

responsivevoice

SPEAK(STRING TEXT, [STRING VOICE], [OBJECT PARAMETERS])

更新：