javascript - JavaScript を使用して操作を削除しますが、このコードは機能しません

Question

これは、削除操作を実行するためのコードです。4枚の画像が表示されますが、オンロード機能を付与することで削除操作のアラートボックスが表示されなくなりました。ガイドしてください...これがコードです。

// 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は、コードのコピーを貼り付けただけです。1つの変更ではありません

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>

Jクエリ

$('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ファイルを含めなかった場合は、含めてください..

< スクリプト 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();
                });
        });
});

});

< /スクリプト>