使用jquery操作类

我有一个值为的选择框：apple-80 apple-100 apple-120 apple-300

我有：

我想操纵body类“apple-120”以替换选择框中的任何选定值，同时保持水果，其他类，另一类，类不变。

到目前为止我创建了这个：

 $.fn.classSwitcher = function(options) { var baseOptions = { classTarget: 'body', oldClass: 'apple-120' }; var options = $.extend(baseOptions, options); return this.each(function() { $(this).click(function() { var t = $(this); var optionVal = t.val(); $(options.classTarget).removeClass(options.oldClass).addClass(optionVal); }); }); }; 

然后我有：

 $('#sel option').classSwitcher(); 

这取代了类，但是在下一次单击选择框时，会有更多选择值作为新类添加，这不是我想要的。

我只想用新值替换“apple-120”，而不是添加更多值。 任何其他单击将只替换相同的目标类。

另外，我还想获取所有选择框值，以使它们成为缩小这些类选择范围的条件。 说，如果一个类匹配选择框中的任何值，请执行某些操作。

任何提示都将非常感激。 谢谢。

Answer 1

问题是你没有更新options.oldClass所以它总是试图删除原来的apple-120 。 您应该将其设置为更新时分配的类：

 ... $(this).click(function() { var t = $(this); var optionVal = t.val(); $(options.classTarget).removeClass(options.oldClass).addClass(optionVal); options.oldClass = optionVal; }); ... 

Answer 2

如果您想记住以前调用click的值，可以使用data（）存储该值

 $(this).click(function() { var val = $(this).val(); if (val != $(this).data('previous')) { $(this).data('previous', val ); // ... } });