jquery selectable - 需要存儲所選值的數組

Question

我需要爲一天中的每個小時創建一個用戶可選網格。我做了一些研究，並找到jquery可選以及這個小提琴 - http://jsfiddle.net/QGzj9/33/ - 經過一些修改後，看起來完全是我想要的。

我的問題是我需要能夠存儲所選值的數組，以便能夠將它們傳遞到PHP來執行數據庫的東西。所以，例如，如果一個li選擇了類，我需要將其值存儲到數組中，或者如果未選中，則將其刪除。

另外，我不需要鼠標的實際選擇能力。相反，我寧願只點擊選擇並點擊取消選擇。我還沒有玩過這麼多，但jquery ui對我來說只是使用它而已。

我包括下面的js，但完整的代碼/ css顯示在小提琴中。

var _selectRange = false, _deselectQueue = []; 

$("#selectable").selectable({ 
    selecting: function (event, ui) { 
     if (event.detail == 0) { 
      _selectRange = true; 
      return true; 
     } 
     if ($(ui.selecting).hasClass('ui-selected')) { 
      _deselectQueue.push(ui.selecting); 
     } 
    }, 
    unselecting: function (event, ui) { 
     $(ui.unselecting).addClass('ui-selected'); 
    }, 
    stop: function() { 
     if (!_selectRange) { 
      $.each(_deselectQueue, function (ix, de) { 
       $(de) 
        .removeClass('ui-selecting') 
        .removeClass('ui-selected'); 
      }); 
     } 
     _selectRange = false; 
     _deselectQueue = []; 
    } 
}); 

編輯解決方案：

我認爲這通過一些更昨晚和今天早上，決定完全不使用UI選擇的。當我只需要一個簡單的切換功能時，我只是沒有看到這一點（鼠標拖動選擇對我來說並不重要）。這裏是所得到的js，它似乎對我來說工作得很好。

$('#selectable li').on('click', function() { 
    $(this).toggleClass('ui-selected'); 
}); 

function getSelected() { 
    var selectedVals = []; 
    $('.ui-selected').each(function(k,v) { 
     selectedVals.push($(v).text()); 
    }); 
    alert(selectedVals); 
} 

$('#getVals').click(function() { 
    getSelected(); 
}); 

Answer 1

FIDDLE

function getSelected() { 
    var selectedVals = []; 
    $('.ui-selected').each(function(k,v) { 
     selectedVals.push($(v).text()); 
    }); 
    alert(selectedVals); 
    } 

var selectedVals = getSelected(); 

當這個函數被調用它會得到selectedVals陣列中的所有選定的值，你可以傳遞給PHP。