如何将php-mysql数据与jquery合并以淡入淡出数据

Question

我使用php-mysql编写了一个简单的select语句，并使用此脚本将文本与另一个脚本进行了更改。

<script type="text/javascript">
    $(document).ready( function() {
       $('#deletesuccess').delay(500).fadeOut(function(){
          $('#deletesuccess').html("text2");
          $('#deletesuccess').delay(500).fadeIn("slow");
       });
    });
</script>

<div id=deletesuccess > text1 </div>

尝试使用php-mysql和jquery上面的脚本显示表中的数据，但它只显示循环不工作的最后一行

$getTextQ = "select * from text";
$getTextR = mysql_query($getTextQ);
while($row = mysql_fetch_array($getTextR)){
?>
        <script type="text/javascript">
     $(document).ready( function() {
    $('#deletesuccess').delay(500).fadeOut(function(){
         $('#deletesuccess').html("<?php echo $row['desc']; ?>");
          $('#deletesuccess').delay(500).fadeIn("slow");
    });
  });
</script>

<?php

   }

但是不能在上面的PHP代码中使用它来逐个显示数据。

Answer 1

您可以使用jQuery ajax轻松完成此操作。

<script type="text/javascript">
    $(document).ready( function() {
        $.ajax({
            url: 'getData.php',
            dataType: 'json',
            type: 'POST',
            success: function(data) {
                $('#deletesuccess').delay(500).fadeOut(function(){
                    $.each(data,function(key, value){
                        $('#deletesuccess').html(value);
                        $('#deletesuccess').delay(500).fadeIn("slow");
                    });
                });
            }
        });
    });
</script>

现在，在getData.php页面中，您需要查询和回显json_encode数据。这意味着getData.php文件应该包含以下代码：

<?php
    $getTextQ = "select * from text";
    $getTextR = mysql_query($getTextQ);
    $json     = '';
    while($row = mysql_fetch_array($getTextR)){
       $json .= $row['desc']; 
    }
    echo json_encode($json);
?>

Answer 2

注意，在php和javascript代码执行之间没有明显的区别。php代码将回显javascript代码，且在php完成执行之后(在文档就绪时)，javascript代码将在istant中执行，因此javascript最后一次回显将在执行中起作用。试着把代码分开。

Answer 3

问题是每次循环运行时都会覆盖JavaScript。相反，你应该这样做：

<script type="text/javascript">
    var php_results = '';
</script>

<?php
$getTextQ = "select * from text";
$getTextR = mysql_query($getTextQ);
while($row = mysql_fetch_array($getTextR)){
?>
    <script type="text/javascript">
        php_results += "<?php echo $row['desc']; ?> | ";
    </script>

<?php
}
?>

<script type="text/javascript">
    $(document).ready( function() {
        $('#deletesuccess').delay(500).fadeOut(function(){
            $('#deletesuccess').html(php_results);
            $('#deletesuccess').delay(500).fadeIn("slow");
        });
    });
</script>

当然，这必须进行清理以使其更美观，但它应该可以工作。我添加了管道作为来自数据库的不同描述之间的分隔符。