javascript - 使用javascript删除操作，但此代码不起作用

Question

这是执行删除操作的代码。出现了四个图像，但是通过提供 onload 功能，删除操作的警告框没有出现。请指导我...这是代码。

// script for deletedelete operation  

    $(document).ready(function(){

        $('a.delete').on('click',function(e){
            e.preventDefault();
            imageID = $(this).closest('.image')[0].id;
            alert('Now deleting "'+imageID+'"');
            $(this).closest('.image')
                .fadeTo(300,0,function(){
                    $(this)
                        .animate({width:0},200,function(){
                            $(this)
                                .remove();
                        });
                });
        });

    });

HTML

//four images being given with delete link


 <div id="container">
        <div class="image" id="image1" style="background-image:url(http://lorempixel.com/100/100/abstract);">
            <a href="#" class="delete">Delete</a>
        </div>
        <div class="image" id="image2" style="background-image:url(http://lorempixel.com/100/100/food);">
            <a href="#" class="delete">Delete</a>
        </div>
        <div class="image" id="image3" style="background-image:url(http://lorempixel.com/100/100/people);">
            <a href="#" class="delete">Delete</a>
        </div>
        <div class="image" id="image4" style="background-image:url(http://lorempixel.com/100/100/technics);">
            <a href="#" class="delete">Delete</a>
        </div>
    </div>

Answer 1

一切正常......让我在这里拍一张。您可能没有在代码中包含 Jquery 文件？？？

你是否包含了这个标签

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>

这个FIDDLE只是您粘贴的代码副本。没有任何变化

HTML

<div id="container">
    <div class="image" id="image1" style="background-image:url(http://lorempixel.com/100/100/abstract);">
        <a href="#" class="delete">Delete</a>
    </div>
    <div class="image" id="image2" style="background-image:url(http://lorempixel.com/100/100/food);">
        <a href="#" class="delete">Delete</a>
    </div>
    <div class="image" id="image3" style="background-image:url(http://lorempixel.com/100/100/people);">
        <a href="#" class="delete">Delete</a>
    </div>
    <div class="image" id="image4" style="background-image:url(http://lorempixel.com/100/100/technics);">
        <a href="#" class="delete">Delete</a>
    </div>
</div>

查询

$('a.delete').on('click',function(e){
        e.preventDefault();
        imageID = $(this).closest('.image')[0].id;
        alert('Now deleting "'+imageID+'"');
        $(this).closest('.image')
            .fadeTo(300,0,function(){
                $(this)
                    .animate({width:0},200,function(){
                        $(this)
                            .remove();
                    });
            });
    });

Answer 2

代码工作正常...如果您没有包含 Jquery 文件，请包含它..

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">

</脚本>

<脚本> $(document).ready(function(){

$('a.delete').on('click',function(e){
    e.preventDefault();
    imageID = $(this).closest('.image')[0].id;
    alert('Now deleting "'+imageID+'"');
    $(this).closest('.image')
        .fadeTo(300,0,function(){
            $(this)
                .animate({width:0},200,function(){
                    $(this)
                        .remove();
                });
        });
});

});

</脚本>