Jquery 在多个相同标签click的问题

最近在做文章的删除动作,用Jquery来执行操作。但是实现时一开始总是只能对第一个起作用,其他的点击删除后没反应。

一开始的jquery代码是这样的,

$('#articledelete').on('click', function(){
        var article_id = $(this).parent('div.small').siblings('#articleid').text();
        var $spanele = $(this);
        console.log(article_id);

        $.ajax({
            type: "GET",
            url:  '/deletearticle/',
            data: {
                "article_id": article_id
            },
            dataType: "json",
            success: function (data) {
                if(data.status){
                    $spanele.parents('.item').remove();
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(XMLHttpRequest.status);
                alert(XMLHttpRequest.readyState);
                alert(textStatus);
            }
        });
    });

后来各种百度才知道,原来是用惯了用id来选取元素,而id是代表唯一性的,所以如果对于多个删除按钮,它只能默认识别为第一个,所以要选多个,应该把id选择器改成类选择器,即把

$('#articledelete') 改成选择该元素的类,这里我给文章的删除标签都加了一个 “articledelete”的类,最后改成
$('.articledelete').on('click', function(){
...
})

就可以了,这也给我自己提了个醒,不要动不动就用id来提取元素,虽然它确实精准,方便。哈哈



原文地址:https://www.cnblogs.com/zongfa/p/7773570.html