Question

我想在ajax完成后隐藏图像：

$('img[src$="control-power.png"]').on('click',function(){
            var id = $(this).attr("id");
            id = id.substring(8);
            var user_id = $('#del_'+id).val();
            var donne = "pk="+user_id;
            $.ajax({
                    data: donne,
                    type: "POST",
                    url:  "<?php echo HTTP_AJAX ?>admin/validerUtilisateurAjax.php", // updating a row in the database
                    async: false,
                    success: function () { $(this).hide(); }
                 });
        });

图像在表格内：

<table id="table" class="data display ">
  <thead style="background-color:#CCC">
    <tr>
      <th>Noms</th>
      <th>N° téléphone</th>
      <th>Région</th>
      <th>Ville</th>
      <th width="5%"></th>
      <th width="5%"><input type="checkbox" id="check_all" style="position: relative; top: 0px; left: 1px;"></th>
      <th width="5%"></th>
    </tr>
  </thead>
  <tbody style="background-color:#FFF">
    <tr class="odd gradeX">
      <td>Andriniaina Jean Aimé</td>
      <td>261324494922</td>
      <td>Boeny</td>
      <td>Mahajanga I</td>
      <td align="center" style="vertical-align:middle"><a href="admin.php?action=AdminModifierUtilisateur&amp;id=269"><img src="http://localhost/bazarmada/pages/img/icons/edit.png" style="height:10px;width:10px;"></a></td>
      <td align="center" style="vertical-align:middle"><input type="checkbox" id="del_0" value="269"></td>
      <td align="center" style="vertical-align:middle"><a><img src="http://localhost/bazarmada/pages/img/icons/control-power.png" id="valider_0" style="height:10px;width:10px;cursor:pointer"></a></td>
    </tr>
    <tr class="odd gradeX">
      <td>Andriniaina Nomenjanahary Todisoa</td>
      <td>261328981998</td>
      <td>Analamanga</td>
      <td>Ambohidratrimo</td>
      <td align="center" style="vertical-align:middle"><a href="admin.php?action=AdminModifierUtilisateur&amp;id=208"><img src="http://localhost/bazarmada/pages/img/icons/edit.png" style="height:10px;width:10px;"></a></td>
      <td align="center" style="vertical-align:middle"><input type="checkbox" id="del_1" value="208"></td>
      <td align="center" style="vertical-align:middle"><a><img src="http://localhost/bazarmada/pages/img/icons/control-power.png" id="valider_1" style="height:10px;width:10px;cursor:pointer"></a></td>
    </tr>
    <tr class="odd gradeX">
      <td>Andriniaina Nomenjanahary Todisoa</td>
      <td>261325306341</td>
      <td>Analamanga</td>
      <td>Ambohidratrimo</td>
      <td align="center" style="vertical-align:middle"><a href="admin.php?action=AdminModifierUtilisateur&amp;id=635"><img src="http://localhost/bazarmada/pages/img/icons/edit.png" style="height:10px;width:10px;"></a></td>
      <td align="center" style="vertical-align:middle"><input type="checkbox" id="del_2" value="635"></td>
      <td align="center" style="vertical-align:middle"><a><img src="http://localhost/bazarmada/pages/img/icons/control-power.png" id="valider_2" style="height:10px;width:10px;cursor:pointer"></a></td>
    </tr>
  </tbody>
</table>

但问题是在运行时数据库已更新但图像仍然显示！那为什么不隐藏呢？

Answer 1

你已经失去了this的背景。在运行回调之前，您需要将其保存在变量中：

$('img[src$="control-power.png"]').on('click',function(){
            var id = $(this).attr("id");
            id = id.substring(8);
            var user_id = $('#del_'+id).val();
            var donne = "pk="+user_id;
            var _this = this; // save
            $.ajax({
                    data: donne,
                    type: "POST",
                    url:  "<?php echo HTTP_AJAX ?>admin/validerUtilisateurAjax.php", // updating a row in the database
                    async: false,
                    success: function () { $(_this).hide(); } // use the saved _this
                 });
        });

Answer 2

您需要将$(this)的引用存储在变量中，然后在成功回调处理程序中使用该变量。

使用

$('img[src$="control-power.png"]').on('click', function() {

    //Store this reference in a variable
    var $this = $(this);

    var id = $(this).attr("id");
    id = id.substring(8);
    var user_id = $('#del_' + id).val();

    var donne = "pk=" + user_id;
    $.ajax({
        data: donne,
        type: "POST",
        url: "<?php echo HTTP_AJAX ?>admin/validerUtilisateurAjax.php", // updating a row in the database
        async: false,
        success: function() {
            //Use the reference variable here 
            $this.hide();
        }
    });
});

Answer 3

您在HTML中使用图像的绝对路径，因此请使用

$('img[src$="http://localhost/bazarmada/pages/img/icons/control-power.png"]').on('click',function(){ ...

元素未隐藏

3 个答案: