使用jquery淡出div

时间:2017-11-23 07:21:19

标签: jquery

我有问题我使用bootstrap(模态)来显示我的表单。我想要做的是当我提交addemployee div时,调用(result)会出现消息。 我想要做的是课后结果出现我想在5s后做出淡出; 这是我的源代码

<div id="content">
                <div class="container">
                    <div class="data">
                       <?php
                                                 if(isset($_POST['addemployee'])){
                                                    //collect data
                                                    $name=$_POST['name'];
                                                    $salary=$_POST['salary'];
                                                    if($name== null){
                                                        echo ' <div class="result btn-success "><span class="center-block"> please insert the value of name </span></div>';
                                                     }elseif (is_numeric($name)) {
                                                        echo ' <div class="result btn-success "><span class="center-block">the value of name must be acharacter </span></div>';  

                                                     }elseif (strlen($name)>20) {


                                                             }elseif($salary==null){
                                                                  echo ' <div class="result btn-success "><span class="center-block"> please insert the value of salary </span> </div>';
                                                             }elseif (!is_numeric($salary)) {
                                                                    echo ' <div class="result btn-success "><span class="center-block">the value of name must be digit </span></div>';
                                                                        }else{
                                                                             $emplyee=new employee($name, $salary);
                                                                             if($emplyee->addemployee()){
                                                                                 echo ' <div class="result btn-success "><span class="center-block "> added <i class="fa fa-thumbs-o-up fa-2x" aria-hidden="true"></i>

                                                                                                    </span> </div>'; 
                                                                        }else{
                                                                             echo ' <div class="result btn-danger "><span class="center-block"> Failed <i class="fa fa-thumbs-o-down fa-2x" aria-hidden="true"></i></span></div>';  
                                                                        }

                                                                           }

                                                 }





                                                     ?>



                        <div class="data-a">
                                            <?php

                                                ?>   

                        <h4 class=" left">Employee List</h4>
                        <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
                            <div class="modal-dialog" role="document">
                              <div class="modal-content">
                                <div class="modal-header">
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                  <h4 class="modal-title" id="exampleModalLabel">Add Employee</h4>
                                </div>
                                <div class="modal-body">
                                    <form action="<?php echo $_SERVER['PHP_SELF']?>" method="post">
                                    <div class="form-group">
                                      <label for="recipient-name" class="control-label ">name:</label>
                                      <input type="text" name="name" class="form-control" id="recipient-name" placeholder="please insert employee name">
                                    </div>
                                    <div class="form-group">
                                      <label for="message-text" class="control-label">salary:</label>
                                      <input type="text" name="salary" class="form-control" id="recipient-nam2e" placeholder="please insert salary">
                                    </div>
                                  <div class="modal-footer">
                                  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                  <button type="submit" name="addemployee"  value="addemployee"class="btn btn-success" id="emadd">addemployee</button>
                                </div>
                                  </form>
                                </div>

                              </div>
                            </div>
                          </div>



                 <button type="button" class="btn btn-success x-right center-block" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">add </button>

                      </div>
                       <div class="clearfix"></div>
                    </div>


                </div>
            </div>



$(document).ready(function (){

     $("#emadd").on("click",function (){
       $('.result').fadeOut(5000);    }); });

0 个答案:

没有答案