使用javascript删除操作,但此代码无效

时间:2013-07-22 12:29:10

标签: javascript

这是执行删除操作的代码。出现四个图像,但是通过提供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>

2 个答案:

答案 0 :(得分:0)

一切正常......让我在这里拍摄一下。您可能没有在代码中包含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>

JQUERY

$('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();
                    });
            });
    });

答案 1 :(得分:0)

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

&LT; script src =“http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js”&gt;

&LT; /脚本&GT;

&LT;脚本&GT; $(文件)。就绪(函数(){

$('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();
                });
        });
});

});

&LT; /脚本&GT;

相关问题