Question

当插件/窗口小部件需要使用自定义“事件”方法而不是标准的jQuery事件时，我无法确定要使用的正确语法。

jQuery UI MultiSelect Widget不支持change方法，而是提供click事件，当选中或取消选中复选框时会触发该事件。我正在尝试使用小部件文档中提供的click事件语法，以便我可以替换多个更改函数，包括下面显示的那些，但是我无法找出正确的语法。 click事件的结构是：

$("[name=Item]").on("multiselectclick", function (event, ui) {...});

我尝试在大括号之间插入函数，我也试过.on("multiselectclick", function () {...});但没有成功，所以我假设我需要在这里插入一些东西：(event, ui)

我已经设法通过使用稍微不同的方法$("[name=Item]").multiselect({ click: function (event, ui) {...}来使函数部分工作，但我真的想了解如何使用插件的自定义事件，以便我可以使函数正常工作。我在这里发布了一个非常简单的例子http://jsfiddle.net/chayacooper/cZRy9/5/，并附有说明，指出哪些方法无法正常工作。

我尝试使用窗口小部件的change事件替换click事件的其中一项功能：

$("[name=Item]").change(function(){
    $("#Styles1, #Styles2").hide();
    $(".accordion").accordion("option", "active", false);
    if( $("[name=Item]").val() === "Dresses"){
        $("#Styles1").show();
        $(".accordion").accordion("option", "active", 0);
        $('varItem').val('Dresses');
    }
    else {...} 
});

Answer 1

未选中Styles时未隐藏dresses元素的第一个问题很简单。代码中没有任何内容可以检查复选框的状态，只有值

修复：

if ((ui.value) === "Dresses" && ui.checked)

在jQuery UI模式小部件中使用ui对象通常是数据或状态的最佳来源，而不是使用jQuery选择器来查找相同的内容。

我从未使用过这个插件，所以为了弄明白我可以使用什么，我只是在点击处理程序中使用console.log(ui)，这样我就可以检查ui对象以查看它包含的属性，并找到要添加到checked条件

以上的if属性

如果你在更复杂的小部件上做同样的事情，比如jQueryUI，datepicker会看到相当多的ui属性，其中一些也是方法函数

DEMO（使用自定义事件）

http://jsfiddle.net/cZRy9/2/

使用插件的自定义事件方法的语法

1 个答案: