php插入返回数据与jquery ajax和淡入淡出效果

我正在使用jquery ajax进行php mysql插入。现在我想添加一个效果：如果插入成功或没有，也会加载从ajax process page淡入淡出的HTML。如何修改？谢谢。php插入返回数据与jquery ajax和淡入淡出效果

的index.php

<script type="text/javascript"> 
    $(function(){ 
     $("#submit").click(function(){ 
     var formvalue = $("#content").val(); 
     var url = 'submit=1&content=' + escape(formvalue); 
     $.ajax({ 
      type: "POST", 
      url: "2.php", 
      data: url, 
      success: function(){ 
      $("#content").val(''); 
      $("#comment").fadeIn(1000, function() { 
       $("#comment").html(html); 
       }); 
      $("#comment").fadeOut(1000, function() { 
       $("#comment").html(''); 
       }); 
      } 
     }); 
     return false; 
     }); 
    }); 
</script> 
<form id="form" action="2.php" method="post"> 
    <textarea name="content" id="content" cols="30" rows="3"></textarea> <br /> 
    <input type="submit" id="submit" name="submit" value="Add comment" /> 
</form> 
<div id="comment"></div>

2.PHP

<?php 
    $connection = mysql_connect('localhost', 'root' , 'root') or die(mysql_error()); 
    $selection = mysql_select_db('my_content', $connection); 

    if(isset($_POST['submit'])){ 

    $content = $_POST['content']; 

    $ins = mysql_query("INSERT INTO msg (content) VALUES ('$content')"); 

    echo 'insert success'; 
    }else{ 
     echo 'failed'; 
     } 
?>

来源

2011-05-09 cj333

请问你能否小心地改述一下你的问题。我似乎无法理解你要去哪里.. – 2011-05-09 13:50:27

@PENDO，当我在'index.php'中插入某些内容时，数据将发送到'2.php'。那么我想从'2.php'中得到'insert success'或'failed'这个词，并显示在'index.php'中的'div＃comment'中。返回的单词可能具有淡入淡出效果。我的意思是，'插入成功'这个词首先在'div＃comment'中淡出，然后消失。谢谢 – cj333 2011-05-09 14:03:30

看到我的'解决方案'下面（没有足够的字符在这里） – 2011-05-09 14:41:10

嗯，你可以使用你从你的后端文件获取回调。改为尝试此操作。

编辑：作为和pENDO提的下方，从2.php返回数据时，你应该使用JSON。

编辑的版本

的index.php

<script type="text/javascript"> 
$(function(){ 
    // EDIT 
    $('#comment').hide();   

    $("#submit").click(function(){ 
    var formvalue = $("#content").val(); 
    $.ajax({ 
     type: "POST", 
     url: "2.php", 
     data: 'content='+formvalue, 
     dataType: 'json', // EDIT set dataType to json 
     success: function(ret){ 
      $("#content").val(''); 
      if(ret['success']) 
      { 
       //Fade in 
       $('#comment').html('Insert Success!').fadeIn(1000); 
       //Fade Out 
       setTimeout(function(){ $('#comment').html('').fadeOut(1000); },1500); 
      }else{ 
       // Fade in 
       $('#comment').html('Insert Failed!').fadeIn(1000); 
       // Fade out 
       setTimeout(function(){ $('#comment').html('').fadeOut(1000); },1500); 
      } 
     } 
    }); 
    }); 
});

<textarea name="content" id="content" cols="30" rows="3"></textarea> <br /> 
<input type="button" id="submit" name="submit" value="Add comment" /> 
<div id="comment"></div>

2.PHP

<?php 
$connection = mysql_connect('localhost', 'root' , 'root') or die(mysql_error()); 
$selection = mysql_select_db('my_content', $connection); 
$content = $_POST['content']; 

/* Set return data to false as default */ 
$json_ret = array('success'=>false); 

$sql = "INSERT INTO msg (content) VALUES ('".$content."')"; 
if(mysql_query($sql)) 
{ 
    /* insert success.. add true */ 
    $json_ret['success'] = true; 
} 

echo json_encode($json_ret); 

?>

来源

2011-05-09 14:20:39 Limpan

谢谢，@ user741991，@PENDO，但我仍然希望'插入成功'与'fadein' - 'fadeout'效果。例如，当日期第一次插入时，显示'插入成功'，然后1秒钟后，'插入成功'从'div＃comment'移动。 – cj333 2011-05-09 15:02:46

@ cj333我最后编辑会为你做的伎俩。 – Limpan 2011-05-09 15:18:49

@ user741991，谢谢，我已经看到你的更新答案，这是我需要的。 – cj333 2011-05-09 15:23:10

确保您的2.php文件返回，可以由jQuery使用json对象或javascript数组。然后确保你的成功函数可以访问返回的数据，但目前情况并非如此。

在上面给出的user741991示例中，您可以看到data对象正在与成功函数一起发送，该函数在成功调用ajax之后调用。如果它是可用对象，则可以使用data.type和data.message（如果返回的对象包含名为'type'和'message'的键）。

希望我已经明确自己，感觉就像我现在正在输入一些不可理解的单词。

来源

2011-05-09 14:40:52

我最后一次更新，谢谢指出:) – Limpan 2011-07-06 12:36:09

php插入返回数据与jquery ajax和淡入淡出效果

回答

相关问题