zoukankan      html  css  js  c++  java
  • js定时器 实现提交成功提示

    应用场景:

      用户评论后,在合适位置弹出“评论成功”,2秒钟后自动消失,提示用户评论成功。

    HTML:

    1 {#评论成功提示#}
    2 <div class="popup_con" style="display: none; margin-left: 300px">
    3         <div class="popup" >
    4                 <p style="color: red; font-size: 16px">评论成功!</p>
    5         </div>
    6         <div class="mask"></div>
    7  </div>

    js:

     // 评论成功提示定时器
     // 定一定时器函数
     function showSuccessMsg() {
         $('.popup_con').fadeIn('fast', function () {
             setTimeout(function () {
                 $('.popup_con').fadeOut('fast', function () {
                 });
             }, 2000)
         });
     }
    
      // 提交评论
      $("#form_comment").submit(function (event) {
          event.preventDefault();
          var comment = $('#comment').val();
          var data = {
              "comment": comment
          };
          $.ajax({
              url: "/task_mgm/taskinfo_comment=" + taskId,
              type: "POST",
              data: JSON.stringify(data),
              contentType: "application/json", // 传给后端的数据类型
              dataType: "json",  // 接收后端的数据类型
              success: function (resp) {
                  if (resp.error == 'OK') {
                                showSuccessMsg();
                                {#alert('评论成功');#}
                                $('#comment').val(''); //清空评论框
                            } else {
                                alert('评论失败');
                            }
                        }
                    })
                })                  
  • 相关阅读:
    TCP/IP四层模型
    Java中equals和==的区别
    最全前端资源汇集
    (转)php面向对象学习笔记
    学习内容
    Gulp入门教程
    seajs的CMD模式的优势以及使用
    正则
    Grunt
    Javascript 异步加载详解
  • 原文地址:https://www.cnblogs.com/We612/p/10405251.html
Copyright © 2011-2022 走看看