onclick按钮后如何自动加载div?

时间:2017-05-29 03:14:45

标签: javascript php html ajax

请帮帮我,我现在可以从我的数据库中删除数据,但它不会自动消失在屏幕上

这是我的代码:

  $(document).on('click','.remove',function(e){
    var x = document.getElementsByTagName('input');
    var a = $(this).attr('data');
    $.ajax({
      url:"http://localhost/scorecard/wp-
      content/themes/twentyseventeen/ajax/submit.php?function=removeScore",
      type:"post",
      data:{ id:a },
      success: function(data){
        alert("Success");
        $('#formUpdateScore').append(data);
      }
    });
  })

这是我的HTML:

<form id="formUpdateScore">
    <?php 
        include(dirname(__FILE__).'/template-parts/php/add_variable.php');
        $var = new variable();
        $connection = $var->connect();
        $var->gi_id = $_POST['id'];
        $GLOBALS['x'] = $var->gi_id;
        $query = "SELECT * FROM business_variable WHERE company_id = ".$var->gi_id;
        $result = mysqli_query($connection,$query);
         while($row = mysqli_fetch_array($result)){
        ?>
        <div class="col-md-4 col-md-offset-1 aligntop">
          <div class="varName">
            <div class="col-md-8" style="padding:0;">
                <span class="variable" name="<?php echo $row['variable_name']?>" value="<?php echo $row['var_id']?>"><?php echo $row['variable_name']?></span>
            </div>
            <div class="col-md-4" style="padding-left: 0;">
                <input type="number" name="name[]" style="width: 55%;height: 40px;float: left;padding: 5px 4px;" class="score" id="getScore" data="<?php echo $row['var_id']?>" value="<?php echo $row['variable_score']?>"/>
                <input type="button" data="<?php echo $row['var_id']?>" class="remove" value="-"/>
            </div>
          </div>
        </div>
       <?php
       }
mysqli_close($connection); ?>
</form>

2 个答案:

答案 0 :(得分:2)

success:function(response){
//on success, hide  element user wants to delete.
$('.classname').fadeOut(); //use element class name or id

}

OR

success:function(response){
//on success, hide  element user wants to delete.
$('.classname').hide(); //use element class name or id
}

答案 1 :(得分:0)

给出代表分数的个别div,类似score的类名,如

<div class="col-md-4 col-md-offset-1 aligntop score">

然后在删除成功函数中找到closest得分div和remove元素。

$(document).on('click','.remove',function(e){
    var inp = $(this);
    var a = inp.attr('data');
    $.ajax({
        url:"http://localhost/scorecard/wp-content/themes/twentyseventeen/ajax/submit.php?function=removeScore",
        type:"post",
        data:{ id:a },
        success: function(data){
            alert("Success");
            inp.closest('.score').remove();
        }
    });
});

问候