javascript - 整个 div 正在删除而不是图像

Question

if(count($father1)!=0) { 
            for($i=0;$i<count($father1);$i++) { 
                if($father1[$i][ 'sbs_f_userid']==$id) { 
                    $pc_pic=$father1[$i][ 'sbs_f_face']. '.'.$father1[$i][ 'sbs_f_format']; 
                    echo '<div class="fpic"><img src="'.$img_loc.'del-but.png" class="myfamily29 dpic f" alt="Click to Delete" title="Click to Delete"/><div class="kpic f"><img src="'.$img_gearup.$pc_pic. '" width="47" height="47" ></div></div>';
?>

我在我的程序中使用这段代码。 FPIC 类制作了一个带有棕色边框的框，其中包含父亲照片和 del-but.png 图像。所以当用户点击 del-but.png 时，下面的过程就会运行。

$(".dpic").click(function () {

                                if ($(this).hasClass("f")) {q = father ; var ddpic = $(this).parent('div').find(".kpic").find("img").attr("src"); var that = $(this).parent('.fpic');}
                                    lbox = new LadduBox();
                                    lbox.init({
                                                "width": 485,
                                                "height": 232,
                                                "HTML": '<div style="width:488px; height:235px; background:url('+img_loc+'bg4.png) no-repeat;"><table cellspacing="0" cellpadding="0" border="0" align="center" width="488" height="152" style="font-family:arial; font-size:18px; font-weight:bold; color:#ffffff;"><tr><td align="right" height="50" valign="top" colspan="2"></td></tr><tr><td align="center">Are you sure you want to delete the picture?</td></tr><tr><td align="center"><div class=" abc yes">YES</div><div class="no" id="btnClose">NO</div></td></tr></table></div>',
                                                'btnCloseId': '#btnClose'
                                    });
                                    lbox.fire();
                                    $(".abc").bind("click", function () {
                                            $.blockUI({ message: '<h3>deleting...</h3>', css: {
                                                    border: 'none',
                                                    padding: '15px',
                                                    'z-index': '1991000',
                                                    background:  'url('+img_loc+'bg4.png)',
                                                                 '-webkit-border-radius': '10px',
                                                                 '-moz-border-radius': '10px',
                                                    color: '#fff'
                                            }
                                            });
                                    $.post("delete_pic.php", {
                                            "ddpic": ddpic,
                                            "user": q,
                                            "uid": sbs.userid
                                    }, function (data) {
                                    if (data.result == "1") {
                                        if( q == "kid"){ $(".kidd").find("img").attr('src',''+img_loc+'blank_face.png');}
                                            if( q == "mother"){ $(".mat").find("img").attr('src',''+img_loc+'blank_face.png');}
                                                if( q == "father"){ $(".fat").find("img").attr('src',''+img_loc+'blank_face.png');}
                                    }
                                                    that.remove();
                                                    setTimeout($.unblockUI, 100); 
                                    }, "json");
                                    lbox.closeladdubox();
                                    });
                    });  
                    }
    });

用户点击后，会问你ARE U SURE U WANT TO DEL ?如果用户点击是按钮然后整个类FPIC被删除

Answer 1

var that = $(this).parent('.fpic');

that 指向 parent ，而不是图像。

你在做什么

that.remove(); 这将删除 fpic 类

你必须

that.find('img').remove();

要替换图片，你可以这样做

that.find('img').attr('src',srcOfAnImage); 而不是 .remove()