更新无法选择的值（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