如何防止在更改时使用jQuery进行多个事件调用

Question

问题在于，有时选择更改.on函数会被多次触发。

通常当我使用.off()函数时，我总是添加event.preventDefault()函数，它的效果很好。但是在这种情况下我不能使用off函数，因为off函数禁用了select输入（我的意思是它不会改变）。

我尝试添加event.stopImmediatePropagation()和$('#addMealToMenuDiet').on('change', function(event) { //then ajax function is called }); ，但这不是解决方案。

JS：

<select id="addMealToMenuDiet" class="form-control">
    ...
</select>

HTML：

Action

我该如何避免这种情况？

解决方案

不幸的是，我的on change方法被置于另一个点击方法中。因此被多次调用......

Answer 1

很可能你的代码运行了多次，你可以简单地在绑定之前解除绑定事件，只需将你的ajax内容放入其他代码之前的函数中

function myAjaxfunction(){
 //...
}

然后运行此选项以初始化您的选择

$(document).off("change", '#addMealToMenuDiet', myAjaxFunction).on("change", '#addMealToMenuDiet', myAjaxFunction)

这样你就可以保存;）