如何使用jquery选择唯一的DIV并取消选择其余的DIV?

如果将颜色作为CSS类,则很容易做到:

$('.selectDiv').click(function(){
   $('.isSelected').removeClass('isSelected');
   $(this).addClass('isSelected');
});

这将全部重置,然后更改当前单击的:

$(".selectDiv").click(function(){
    $(".selectDiv").css("background","#FFFFFF");
    $(this).css("background","#FF00CC"); 
});

如果添加类而不是更改CSS,则可以根据选择器中的类名进行筛选。

var currentDiv = null;

$('div.selectDiv').click(function() {
    if (currentDiv !== null) {
        currentDiv.css('background', '#ff00cc');
    }
    currentDiv = $(this);
    currentDiv.css('background', '#ffffff');
});

您的jQueryUI可选择的单击事件不应使用Div的单击事件自动分配。可选功能有自己的事件绑定,称为“停止”。

var previousSelection = {}; // Use this to store the previous selection if desired

$('#selectDiv-Container').selectable({
                    stop: function() {
                        previousSelection = $(this);
                        $('.ui-selected', this).each(function() {
                            // Iterate through my new selections if desired.
                        });
                    }
                });

我假设您的可选择列表中有一个名为“selectDiv container”的容器,以便进行说明。如果要将以前单击的项保存在内存中(以设置其样式或其他方式),可以将其缓存在上述变量中。( previousSelection )

当用户单击列表时,“停止”事件将触发。您可以迭代所有选定的值,并在该点设置它们的样式。