jquery可选-需要存储选定值的数组

我需要为一天中的每个小时创建一个用户可选择的网格。我做了一些研究,发现jquery可选,还有这个小提琴- http://jsfiddle.net/QGzj9/33/ -经过一番修改后,它将完全符合我的要求。

我的问题是,我需要能够存储一个选定值的数组,以便能够将它们传递给php来执行db操作。因此,例如,如果li选择了类,我需要将其值存储到数组中,如果未选择,则将其删除。

此外,我不需要鼠标的实际选择能力。相反,我宁愿只单击以选择,而单击以取消选择。我还没有玩过这么多,但jquery ui对我来说是新的。

我在下面包含了js,但完整的代码/css显示在fiddle中。

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();
});