单击“删除Img”按钮，它将删除图像并转到主页，但执行此操作两次后，它可以正常工作

Question

这是一款cordova Android应用。每当我点击删除img按钮时，它会删除img并转到主页，但在做了两次之后它会删除同一页面上的img，这很好。

我不想让它去主页。请帮忙。

// Html页面

<div id="main">
    <div id="server-div" style="display:none;">
        Server URL :<input type="text" name="server_1" id="server_1" 
        value="http://www.indiafastener.com/webservices/listing/upload.php" />
    </div>
    <div id="gallery_images_list"></div>
    <br>
    <div><button style="color: black" id="remImg" onclick="delImg()" 
         hidden>Delete Image</button>
    </div>
    <br><img id="loader_icon" src="images/loader.gif" style="display:none;" />
    <br>
    <div id="picture_msg_1" style="color:green;font-size:11px;"> </div>
    <br>
    <div id="image-upload" onClick="uploadImageGallery()">
        <img id="pimage_1" src="images/file-upload-1.png" width="64px" 
        height="64px" />
    </div>
    <input type="hidden" name="server_image_url_1" id="server_image_url_1">

</div>

//代码

//Upload image
function uploadImageGallery() {

        var imgage = document.getElementById('pimage_1');
        //$("#add_company_category").val("Loading gallery...");
        //$("#add_company_category").html("Loading gallery...");
        $("#loader_icon").css('display', 'block');
        document.getElementById('picture_msg_1').innerHTML = "";
        // Get URI of picture to upload
        navigator.camera.getPicture(
            function(uri) {
                try {

                    // Pick image from div
                    var img = document.getElementById('pimage_1');
                    //   var img_11 = document.getElementById('pimage_11');
                    img.style.visibility = "visible";
                    img.style.display = "block";
                    var imageURI = uri;
                    if (!imageURI || (img.style.display == "none")) {
                        document.getElementById('picture_msg_1').innerHTML = "Tap on picture to select image from gallery.";
                        return;
                    }
                    // Verify server has been entered
                    server = document.getElementById('server_1').value;
                    //  server = http +'/webservices/listing/upload.php';
                    server = http + '/gallery-upload.php?post_id=' + localStorage.post_id_1;
                    console.log("Server " + server);
                    //        alert("Server "+server);
                    if (server) {
                        // Specify transfer options
                        var options = new FileUploadOptions();
                        options.fileKey = "file";
                        options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1);
                        options.mimeType = "image/jpeg";
                        options.chunkedMode = false;

                        // Transfer picture to server
                        var ft = new FileTransfer();
                        ft.upload(imageURI, server, function(r) {
                                document.getElementById('picture_msg_1').innerHTML = "Upload successful: " + r.bytesSent + " bytes uploaded.";
                                //  img.src = uri;
                                //  img.width = 50;
                                //  img.height = 50;
                                $("#gallery_images_list").append('<img src="' + uri + '" style="width:50px;" id="im">');
                                // shows delete img button
                                document.getElementById('remImg').removeAttribute('hidden');
                                $("#server_image_url_1").val(r.response.toString());
                                //$("#add_company_category").val("Submit & Finish");
                                //$("#add_company_category").html("Submit & Finish");
                                $("#loader_icon").css('display', 'none');

                            },
                            function(error) {
                                document.getElementById('picture_msg_1').innerHTML = "Upload failed: Code = " + error.code;
                            }, options);
                    } else {
                        document.getElementById('picture_msg_1').innerHTML = "Server Not Found";
                    }
                } catch (exce) {
                    navigator.notification.alert(exce);
                }
            },
            function(e) {
                console.log("Error getting picture: " + e);
                document.getElementById('picture_msg_1').innerHTML = "No Image Found";
            }, {
                quality: 50,
                destinationType: navigator.camera.DestinationType.FILE_URI,
                sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
            }
        );
    }

    // Delete image
    function delImg() {
        $(function() {
            document.getElementById('im').remove();
            document.getElementById('picture_msg_1').innerHTML = "Image Removed";

            delBtn();
        });
    };

// Hide Delete Button

    function delBtn() {
        var x = document.getElementById('gallery_images_list').childElementCount;
        if (x < 1) {
            document.getElementById('remImg').setAttribute('hidden');
            document.getElementById('picture_msg_1').innerHTML = "";
        }

    };

Answer 1

编辑2：

尝试更改此

function delBtn() {
    var x = document.getElementById('gallery_images_list').childElementCount;
    if (x < 1) {
        document.getElementById('remImg').setAttribute('hidden');
        document.getElementById('picture_msg_1').innerHTML = "";
    }

};

到这个

function delBtn() {
    var x = document.getElementById('gallery_images_list').childElementCount;
    if (x < 1) {
        $('#remImg').attr('hidden', true);
        $('#picture_msg_1').html("");
    }

};

修改

尝试更改此代码：

function delImg() {
    $(function() {
        document.getElementById('im').remove();
        document.getElementById('picture_msg_1').innerHTML = "Image Removed";

        delBtn();
    });
};

对此。

function delImg() {
        $('#im').remove();
        $('#picture_msg_1').html("Image Removed");

        delBtn();
};

我认为您使用的是remove（）方法错误。你需要知道父母，并从中删除孩子。

var child = document.getElementById("p1");

child.parentNode.removeChild(child);

这个例子来自这里。

https://www.w3schools.com/js/js_htmldom_nodes.asp

你也可以使用jQuery。

$('#id').remove()