更新無法選擇的值（jquery）

Question

我正在使用可選的jquery，我想迎合選擇一次使用的值選擇或取消選擇該項目。我的問題是，不可選擇的最後一個值不會更新。 Full code here http://jsfiddle.net/duQH6/當我選擇星期一和星期二時，我取消選擇星期二，值被更新，但是當我點擊星期一時，數值沒有更新。請指教。

這裏我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值，所以當你取消選擇的最後一個元素是永遠不會執行循環回調這就是它發生的原因。

一旦each()循環完成，應該更新days值。

$(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