Question

我遇到了off()和on()事件绑定到select下拉列表这个奇怪的问题：

如果我取消绑定然后将change事件重新绑定到select下拉列表，我将无法更改显示的下拉列表值。换句话说，即使更改事件被触发，下拉列表中也不会正确更新所选值。

如果我删除off()部分，只留下与on()绑定的事件，一切正常，但显然我无法阻止同一事件的绑定多次。

测试用例：

使用下拉列表（它有效！所选值正确显示在下拉列表中）
刷新页面。点击第一个按钮（关闭/开启），然后使用下拉列表。由于所选值不会更改，它无法正常工作
刷新页面。点击第二个按钮（仅限），然后使用下拉列表。它确实按预期工作。副作用：在第二个按钮上单击 n 次，将 n 次更改事件的次数改为下拉元素

以下是代码：

//--- This binds the event to the element
function bindEvent(){
   $("#myselect").on("change", function(){
        console.log("change"); 
    });
}

//--- remove any change event previously added, then rebind it
function rebindEvent(){
    $("#myselect").off("change").on("change", function(){
        console.log("change"); 
    });
}

提前致谢

Answer 1

尝试使用namespacing：

//--- This binds the event to the element
function bindEvent(){
   $("#myselect").on("change.something", function(){
        console.log("change"); 
    });
}

//--- remove any change event previously added, then rebind it
function rebindEvent(){
    $("#myselect").off("change.something").on("change", function(){
        console.log("change"); 
    });
}

正如@Karl所说，使用命名空间是：

为您的活动命名可让您识别该活动。因此，当使用.off时，您可以将特定事件定位为关闭。

Answer 2

删除.selectmenu("refresh")绑定时，您必须致电change。因为默认情况下，change附加到选择菜单here。因此，如果删除它，则从“刷新”中断jQuery Mobile小部件以直观地显示值。

看到它正常工作here。

function rebindEvent(){
    $("#myselect").off("change").on("change", function(){
        $(this).selectmenu("refresh");
    });
}

下拉选项＆＃34;更改＆＃34;如果更改事件未绑定然后反弹，则无法正常工作

2 个答案: