更改選擇框中的選定值

Question

那麼這裏是我的代碼來做到這一點。

但正如你所看到的，它的醜陋。

任何人有任何更好的想法？

.delegate(".ui-icon-plus", "click", function() { 
    var d = $(this).parent().data("val"); 
    var values = $(obj).val(); 
    values.push(d); 
    $(obj).val(values); 
    $(this) 
    .removeClass('ui-icon-plus') 
    .addClass('ui-icon-minus') 
    .attr('title', 'Remove keyword from template') 
    .parent().appendTo('div .keyword-left .ui-widget'); 
}) 
.delegate(".ui-icon-minus", "click", function() { 
    var d = $(this).parent().data("val"); 
    var values = $(obj).val(); 
    var idx = values.indexOf(d); // Find the index 
    if(idx!=-1) values.splice(idx, 1); // Remove it if really found! 
    $(obj).val(values); 
    $(this) 
    .removeClass('ui-icon-minus') 
    .addClass('ui-icon-plus') 
    .attr('title', 'Use keyword in template') 
    .parent().appendTo('div .keyword-right .ui-widget'); 
}); 

Answer 1

你有什麼作品，你可以用雙重類.toggleClass()調用每一個，但有一個問題區域。 .indexOf()不適用於陣列在IE < 9，所以我要麼添加.indexOf()或使用這裏$.inArray()，像這樣：

.delegate(".ui-icon-plus", "click", function() { 
    var d = $(this).parent().data("val"); 
    var values = $(obj).val(); 
    values.push(d); 
    $(obj).val(values); 
    $(this).toggleClass('ui-icon-plus ui-icon-minus') 
     .attr('title', 'Remove keyword from template') 
     .parent().appendTo('div .keyword-left .ui-widget'); 
}) 
.delegate(".ui-icon-minus", "click", function() { 
    var d = $(this).parent().data("val"); 
    var values = $(obj).val(); 
    var idx = $.inArray(d, values); // Find the index 
    if(idx!=-1) values.splice(idx, 1); // Remove it if really found! 
    $(obj).val(values); 
    $(this).toggleClass('ui-icon-plus ui-icon-minus') 
     .attr('title', 'Use keyword in template') 
     .parent().appendTo('div .keyword-right .ui-widget'); 
});