更新不可选择的值（jquery）

Question

我正在使用可选择的 jquery，我想在使用选择或取消选择项目后满足可选择的值。我的问题是，unselectable 的最后一个值不会更新。 完整代码在这里http://jsfiddle.net/duQH6/ 当我选择 Mon 和 Tue，然后我取消选择 Tue，值会更新，但是当我单击 Mon 时，值不会更新。请指教。

这是我的 jquery 代码

$(function() {
$("#selectday1").bind('mousedown', function (e) {
        e.metaKey = true;
}).selectable();
}); 

$('document').ready(function(){ 
$( "#selectday1" ).selectable({
    selected: function(event, ui) {
        var result=[];
        jQuery(".ui-selected", this).each(function() 
        {
        result.push(this.id);
        $("#days").val(result.join(','))
        });
    }
});
$( "#selectday1" ).selectable({
    unselected: function(event, ui) {
        var result=[];
        jQuery(".ui-selected", this).each(function() 
        {
        result.push(this.id);
        $("#days").val(result.join(','))
        });
    }
});
}); 

谢谢..

Answer 1

问题是，您正在更新 each 循环中的 days 值，因此当您取消选择最后一个元素时，循环回调永远不会执行，这就是它发生的原因。

days 值应该在 each() 循环完成后更新。

$(document).ready(function () {
    $("#selectday1").selectable({
        selected: function (event, ui) {
            var result = [];
            jQuery(".ui-selected", this).each(function () {
                result.push(this.id);
            });
            $("#days").val(result.join(','))
        },
        unselected: function (event, ui) {
            var result = [];
            jQuery(".ui-selected", this).each(function () {
                result.push(this.id);
            });
            $("#days").val(result.join(','))
        }
    });
});

演示：Fiddle

但可以简化为

jQuery(function ($) {
    function serialize(event, ui) {
        var result = $(this).find(".ui-selected").map(function () {
            return this.id;
        }).get();
        $("#days").val(result.join(','))
    }

    $("#selectday1").selectable({
        selected: serialize,
        unselected: serialize
    });
});

演示：Fiddle