更改选择框中的选定值

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