1

当我添加用于设置 Select 或 Multi-Select 元素样式的插件/小部件（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 元素的功能（不起作用） http://jsfiddle.net/chayanyc/3jr2v/69/ - UI MultiSelect Widget 样式的 Multi-Select 元素的功能（不起作用）

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")) {
    $("<option>", {
        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");
}
});
4

2 回答 2

6

由于 DropKick 插件和 MultiSelect Widget<select>用新的 html 元素（主要是<div>'s）替换了您的原始元素，因此您附加到原始元素的更改事件<select>不会触发，因为它已被替换。

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

DropKicks 看起来像这样：

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

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

$("#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)
*/
});

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

于 2012-11-20T18:27:23.483 回答
0

我想为其他 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")) {
        $("<option>", {
            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");
    }
}
});
于 2012-11-23T17:32:28.040 回答