将Dropkick或MultiSelect插件添加到样式选择元素时，更改function停止工作

当我添加用于样式选择或多选元素的插件/小部件时，此更改function停止工作（Dropkick – http://jamielottering.github.com/DropKick/和jQuery UI MultiSelect Widget http：// www。 erichynds.com/jquery/jquery-ui-multiselect-widget/ ）:-(

知道怎么解决这个问题吗？

我把插件添加到小提琴中时遇到了一些麻烦，所以我创建了单独的小提琴： http ： //jsfiddle.net/chayanyc/Dhaat/201/ – 有效的函数http://jsfiddle.net/chayanyc/vWLEn/89/ -使用由Dropkick设计的Select元素的function（不起作用） http://jsfiddle.net/chayanyc/3jr2v/69/ – 由UI MultiSelect Widget设置的多选元素的function（不起作用）

var $increase_priority1 = $(".increase_priority1"); $(".trigger_rank1, .complaint select").change(function () { var name = $(this).data("name"); if ($("#Shoulders select").val() === "Too_small" && $(this).val() == 1 && !$(this).data("increase_priority1")) { $("", { text: name, val: name }).appendTo($increase_priority1); $(this).data("increase_priority1", true); } if ($(this).data("increase_priority1") && $(this).val() != 1) { $("option[value=" + name + "]", $increase_priority1).remove(); $(this).removeData("increase_priority1"); } }); 

Answer 1

由于DropKick插件和MultiSelect Widget用新的html元素（主要是

）替换原始的 ，因此附加到原始的更改事件将不会触发，因为它已被替换。

因此，您必须使用插件api来分配更改事件处理程序。 您链接的两个站点都有此文档。

DropKicks看起来像这样：

 $('.change').dropkick({ change: function (value, label) { alert('You picked: ' + label + ':' + value); } }); 

Multiselect Widget有一个如下所示的click事件：

 $("#multiselect").bind("multiselectclick", function(event, ui){ /* event: the original event object ui.value: value of the checkbox ui.text: text of the checkbox ui.checked: whether or not the input was checked or unchecked (boolean) */ }); 

您必须以这种方式附加您的更改事件逻辑

Answer 2

我想留下其他Dropkick用户的完整代码

 var $increase_priority1 = $(".increase_priority1"); $('.trigger_rank1, .complaint select').dropkick({ change: function () { var name = $(this).data("name"); if ($("#Shoulders select").val() === "Too_small" && $(this).val() == 1 && !$(this).data("increase_priority1")) { $("", { text: name, val: name }).appendTo($increase_priority1); $(this).data("increase_priority1", true); } if ($(this).data("increase_priority1") && $(this).val() != 1) { $("option[value=" + name + "]", $increase_priority1).remove(); $(this).removeData("increase_priority1"); } } });