设置延迟

Question

所以我有html表单通过AJAX将数据发送到PHP，如：

的index.html

<script type="text/javascript"> 
    $("#button").click(function(){ 
     var ajaxname=$("#name").val(); 
     $.ajax({ 
      method:"POST", 
      url:"some.php", 
      data:"name="+ajaxname, 
      success:function(data){ 
       $("#formresult").html(data); 
      } 
     }); 
    } 
</script> 

<form> 
    <input type="text" name="name" id="name"> 
    <input id="button" type="button" value="send"/> 
</form> 
<div id="formresult"></div> 

和php文件，如：

some.php

<?php 

$name = $_POST['name']; 

if($name == "mahdi"){ 
    echo 'true' . '<br/>'; 
    echo 'welcome' . '<br/>'; 
    echo 'have good time!' . '<br/>'; 
} 
else{ 
    echo 'false' . '<br/>'; 
    echo 'wrong name' . '<br/>'; 
} 

?> 

当表单提交和AJAX回调成功时，一起显示所有回显。但我想回声“延迟时间”例如任何回声之间2秒。

我用 “睡眠（2）;” 在PHP中， “的setTimeout” 和 “for循环” 在JavaScript中，但没有人不工作。

请有人知道答案在https://jsfiddle.net/看到它的工作。

Answer 1

这里很混乱。如果我理解正确，你希望每个回声在它们之间以2秒的延迟执行，导致每个回声的文本在页面上一个接一个地显示？

如果是这样，你不能使用一个PHP脚本和一组回声。您需要发回一串字符串，并让JavaScript使用setInterval一次显示一个字符串。

编辑例如：

PHP会是这样的：

<?php 
header('Content-Type: application/json'); 
$name = $_POST['name']; 

if($name == "mahdi"){ 
    echo json_encode(array('true', 'welcome', 'have good time!')); 
} else { 
    echo json_encode(array('false', 'wrong name')); 
} 

和JS一样：

$("#button").click(function(){ 
    var ajaxname = $("#name").val(); 
    $.ajax({ 
     method: "POST", 
     url: "some.php", 
     dataType: "json", 
     data: "name=" + ajaxname, 
     success: function (data) { 
      var index = 0; 
      var intervalId = setInterval(function() { 
       $("#formresult").append('<p>' + data[index] + '</p>'); 
       index = index + 1; 
       if (index === data.length) { 
        clearInterval(intervalId); 
       } 
      }, 2000); 
     } 
    }); 
} 

这成功的Ajax响应后设置一个的setInterval。在所有消息被追加到#formresult后，间隔被清除。

Answer 2

当您使用Ajax时，请求发送到服务器并等待服务器执行作业并返回响应。您无法在分离的部分中获得结果。

你必须使用Socket来做这样的事情。

Answer 3

，使其在PHP耽误事：

<?php 
sleep(1); 
$name=$_POST['name']; 

if($name == "mahdi"){ 

echo 'true' . '<br/>'; 

echo 'welcome' . '<br/>'; 

echo 'have good time!' . '<br/>'; 
} 
else{ 
echo 'false' . '<br/>'; 
echo 'wrong name' . '<br/>'; 
} 

?> 

但对于JavaScript中使用：

<script type="text/javascript"> 

    $("#button").click(function(){ 

var ajaxname=$("#name").val(); 
    $.ajax({ 
      method:"POST", 
      url:"some.php", 
      data:"name="+ajaxname, 
      success:function(data){setTimeout(function(data){ 
          $("#formresult").html(data); 

           }}); 
          },2000,data)}; 
</script> 

<form> 
<input type="text" name="name" id="name"> 
<input id="button" type="button" value="send"/> 
</form> 
<div id="formresult"></div> 

请记住，通过使用两个片段，你会得到一个总的4秒的延迟。

Answer 4

使用下面的代码

<?php 

    $name="mahdi"; 

    if($name == "mahdi"){ 

    echo 'true' . '<br/>'; 
    sleep(2); 
    echo 'welcome' . '<br/>'; 
    sleep(2); 
    echo 'have good time!' . '<br/>'; 
    } 
    else{ 
    echo 'false' . '<br/>'; 
    echo 'wrong name' . '<br/>'; 
    } 

    ?> 

Answer 5

请通过此。您可以使用setTimeout。

https://jsfiddle.net/687qgqz0/?utm_source=website&utm_medium=embed&utm_campaign=687qgqz0

Answer 6

您可以从php返回一个数组，迭代返回数组$.each()，使用.delay()，.queue()，在success给每个呼叫之间的延迟两秒.append()

<form> 
    <input type="text" name="name" id="name"> 
    <input id="button" type="button" value="send" /> 
</form> 
<div id="formresult"></div> 
<script type="text/javascript"> 
    var arr = ["true<br/>" 
      , "welcome<br/>" 
      , "have good time!<br>" 
      , "false<br/>" 
      , "wrong name<br>"]; 
    $("#button").click(function() { 

    var ajaxname = $("#name").val(); 
    $.ajax({ 
     method: "POST", 
     url: "/echo/json/", 
     data: { 
     json: JSON.stringify(arr) 
     }, 
     dataType: "json", 
     success: function(data) { 
     $.each(data, function(index, html) { 
      $("#formresult").delay(2000) 
      .queue(function(next) { 
       $("#formresult").append(html); 
       next() 
      }) 
     }) 
     } 
    }); 
    }) 

</script> 

的jsfiddle https://jsfiddle.net/berhth9r/