Question

有更好的方法来编码吗？我有大约100个项目，每个项目都有点击事件。有没有办法使用.delegate，或者只是一种更好的方法来处理它？这段代码也是我想要的方式，但我希望它更具动态性。基本上，div中的类div被单击，并且我希望在选择之后将整个父div克隆到另一个div中。如果需要更多信息，请告诉我。

谢谢！迈克尔

$(function() { 
        $(".select1").click(function () {
            if ($('.saved_list .thumb1').length == 0 && $('.saved > li').length < totalPic)
                {
                    $(this).parent().clone().appendTo('.saved_list ul');
                    $('.saved .select1').replaceWith('<div class="remove">Remove</div>');
                    $('.saved a').contents().unwrap();
                    //alert($('.saved > li').length);
                } else {
                alert ('You can only choose 3 paintings');  
                }
        });

        $(".select2").click(function () {
            if ($('.saved_list .thumb2').length == 0 && $('.saved > li').length < totalPic)
                {
                    $(this).parent().clone().appendTo('.saved_list ul');
                    $('.saved .select2').replaceWith('<div class="remove">Remove</div>');
                    $('.saved a').contents().unwrap();
                    //alert (ct);
                } else {
                alert ('You can only choose 3 paintings');  
                }
        });

        $(".select3").click(function () {
            if ($('.saved_list .thumb3').length == 0 && $('.saved > li').length < totalPic)
                {
                    $(this).parent().clone().appendTo('.saved_list ul');
                    $('.saved .select3').replaceWith('<div class="remove">Remove</div>');
                    $('.saved a').contents().unwrap();
                } else {
                alert ('You can only choose 3 paintings');  
                }
        });

        $(".select4").click(function () {
            if ($('.saved_list .thumb4').length == 0 && $('.saved > li').length < totalPic)
                {
                    $(this).parent().clone().appendTo('.saved_list ul');
                    $('.saved .select4').replaceWith('<div class="remove">Remove</div>');
                    $('.saved a').contents().unwrap();
                } else {
                alert ('You can only choose 3 paintings');  
                }
        });


        $(".select5").click(function () {
            if ($('.saved_list .thumb5').length == 0 && $('.saved > li').length < totalPic)
                {
                    $(this).parent().clone().appendTo('.saved_list ul');
                    $('.saved .select5').replaceWith('<div class="remove">Remove</div>');
                    $('.saved a').contents().unwrap();
                } else {
                alert ('You can only choose 3 paintings');  
                }
        }); 
});

Answer 1

添加

data-selectid="X"

进入.selectX元素，其中x是最后一个数字，并添加新类 - 选择

$(function() { 
        $(".selects").click(function () {
            var id = $(this).data('selectid');
            if ($('.saved_list .thumb'+id).length == 0 && $('.saved > li').length < totalPic)
                {
                    $(this).parent().clone().appendTo('.saved_list ul');
                    $('.saved .select'+id).replaceWith('<div class="remove">Remove</div>');
                    $('.saved a').contents().unwrap();
                    //alert($('.saved > li').length);
                } else {
                alert ('You can only choose 3 paintings');  
                }
        });


});

冷凝点击事件/功能

1 个答案: