Ajax在运行后加载新消息

时间:2014-09-29 07:31:32

标签: javascript jquery ajax

好的,我写了一个用于向db添加数据的ajax脚本。我的问题是当我添加数据相同的消息时,所以很难看到新操作是否完成。有任何方法可以在显示消息后隐藏消息,并在下一个ajax操作后显示新消息。我的代码是

function change_data(id){

    var data = document.getElementById('update'+id).innerText;

  var new_data = prompt(data,'Unesite novi podatak!').trim();

 if(new_data !=='' && new_data !== null){
    $.ajax({
    url: "<?php echo base_url().'admin/crud/changes'?>",
    type: 'post',
    data: {'id' : id, 'new_data':new_data },
    success: function(resp){
          if(resp==""){

         $('#warning').html('Podatak je azuriran');

         $('#update'+id).html(new_data);

      }
    }
    });
}

在这部分我将html添加到div,所以每次都有相同的消息

 $('#warning').html('Podatak je azuriran');

5 个答案:

答案 0 :(得分:0)

您可以在成功回调函数中隐藏它: -

if(new_data !=='' && new_data !== null){

    $('#warning').html('Podatak je azuriran');

    $.ajax({
    url: "<?php echo base_url().'admin/crud/changes'?>",
    type: 'post',
    data: {'id' : id, 'new_data':new_data },
    success: function(resp){
          if(resp==""){

         $('#warning').html('');

         $('#update'+id).html(new_data);

      }
    }
    });

答案 1 :(得分:0)

像这样设置超时功能

$('#warning').html('Podatak je azuriran');
setTimeout(function() {
    $('#warning').html('');
    $('#warning').hide('');
}, 2000);

其中2000是您希望执行此功能的毫秒数

答案 2 :(得分:0)

我会像这样使用fadeOut那部分jquery :(抱歉没有实际的ajax调用),它会使元素淡出数毫秒(此代码块中的1000,或链接演示中的2000)

<html>
<head>
    <title></title>
    <script src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#Button').click(function () {
                $('#MessageOutput').show();
                $('#MessageOutput').html("Sending data..");
                // Do ajax call

                // In "Success":
                $('#MessageOutput').html("Data transfer done");
                $('#MessageOutput').fadeOut(1000);
                //$('#MessageOutput').delay(2000).fadeOut(1000);
                //$('#MessageOutput').delay(2000).hide(0); 
                // Note: In the last example: you must supply a 
                // 0 as an argument for .hide(), otherwise hide is not animated, and won't
                // be delayed by .delay (it will just hide it immediately
            });
        });
    </script>
</head>
<body>
    <button id="Button">asdasd</button>
    <div id="MessageOutput">

    </div>
</body>
</html>

http://fiddle.jshell.net/2vk2bbz7/4/

答案 3 :(得分:0)

你可以使用jquery延迟和淡出功能

$('#warning').html('Podatak je azuriran').delay(3000).fadeOut(300)

答案 4 :(得分:0)

一旦再次调用该函数,就可以使警告div为空 或者你可以在3或5秒后填写警告div 使用javascript函数“setTimeout”