弹出div中的成功消息,没有刷新页面

时间:2018-03-15 13:39:14

标签: php jquery ajax

我想在不刷新页面的情况下在弹出div中显示成功的短信

我的弹出窗体

<a href="#"  data-toggle="modal" data-target="#call-back">
    <input type="submit" value="Call" class="btn-d btn-doctor" > 
</a>  

当我点击此链接时弹出将调用

<style type="text/css"> 

    #message { 
        display:none; 
        font-size:15px; 
        font-weight:bold; 
        color:#333333; 
    } 
</style> 

CSS:

<script>
    $("#callback").click(function () {
        var custmobileNo = $("#custmobileNo").val();
        $.ajax({
            url: "<?php echo base_url('Call'); ?>",
            type: 'post',
            data: {custmobileNo: custmobileNo},
            beforeSend: function () {
                if (custmobileNo != "") {
                    $("#message").fadeIn(); //show confirmation message

                    $("#CallBackForm")[0].reset(); //reset fields
                }
            }
        });
    });
</script>

Ajax Call:

beforeSend function()

我用QT写了一些数据,要么是标准代码,要么不知道。它正在调用消息,但它没有关闭我希望它会在几秒钟后关闭并再次点击按钮成功消息验证显示我也想要清除该文本。

1 个答案:

答案 0 :(得分:0)

尝试类似这样的事情:

$.ajax({
    url: "<?php echo base_url('Call'); ?>",
    type: 'post',
    data: {custmobileNo: custmobileNo},
    beforeSend: function () {
        if (custmobileNo != "") {
            $("#message").fadeIn(); //show confirmation message
            $("#CallBackForm")[0].reset(); //reset fields
        }
    },
    success: function() {
        setTimeout(function() {   //hide message after a certain time
            $("#message").fadeout();
        }, 5000); // choose after how many time message should hide, here 5s
    }
});

但是如果你的Ajax调用失败了,那么你就不会进入成功部分了!

您可以使用complete : function() {...}代替success : function() {...}执行相同操作,以下是有关Ajax事件的一些信息:https://api.jquery.com/Ajax_Events/

这是你在找什么?