jQuery是一種流行的JavaScript庫，廣泛用于Web開發(fā)中。在Web開發(fā)中經常需要選擇文件夾，使用jQuery可以輕松實現此功能。本文將介紹如何使用jQuery連續(xù)選擇文件夾。

假設我們的HTML文件中有一個名為“folder”的div元素，我們想要實現連續(xù)選擇文件夾。首先，我們需要綁定div的click事件。在每次點擊后，我們將選擇的文件夾名稱添加到一個數組中，并將最后一個選定文件夾的子文件夾顯示在div元素中。

var selectedFolders = []; // 存儲所選文件夾名的數組
$('#folder').on('click', function (event) {
var folderName = $(event.target).text(); // 獲取所選文件夾名
selectedFolders.push(folderName); // 將文件夾名添加到數組中
// 獲取最后一個選定的文件夾對象
var lastFolder = $(this).find('div').filter(function () {
return $(this).text() == selectedFolders[selectedFolders.length - 1];
});
// 顯示最后一個選定文件夾的子文件夾
lastFolder.children('div').show();
});

在上述代碼中，我們首先定義了一個數組，用于存儲所選文件夾名稱。然后，我們綁定了div元素的click事件，在每次點擊時獲取所選文件夾的名稱，并將其添加到數組中。接著，我們獲取最后一個選定的文件夾對象，并將其子文件夾顯示出來。

在以上代碼基礎上，我們可以通過一些小的改動來實現取消選擇、清空選擇等功能。例如：

$('#folder').on('click', function (event) {
...
// 點擊已選中的文件夾，取消選擇并從數組中刪除
if ($(event.target).hasClass('selected')) {
$(event.target).removeClass('selected');
selectedFolders.splice(selectedFolders.indexOf(folderName), 1);
} else {
// 點擊未選中的文件夾，添加選擇
$(event.target).addClass('selected');
...
}
...
});
// 清空所有選擇
$('#clear').on('click', function () {
$('#folder').find('div').hide().removeClass('selected');
selectedFolders = [];
});

以上代碼實現了取消選擇和清空選擇的功能。當點擊已選中的文件夾時，我們將在數組中刪除該文件夾名稱，并將該文件夾的樣式設置為未選中狀態(tài)。而當點擊未選中的文件夾時，則將其添加到數組中，并將其設置為選中狀態(tài)。清空選擇的功能則是將選中的文件夾樣式設置為未選中，并清空數組。