jQuery 绑定事件失效
先对 jQuery 对象绑定事件,之后创建 Vue 对象,这样会导致绑定的事件失效。
//对jQuery对象绑定事件 $("#id").on("change", function () { //action…… });
问题所在:
定义 jQuery -> 正常关联DOM -> 使用 Vue -> jQuery与DOM断开关联
具体原因不清楚,在 Chrome 调试中发现,在使用 Vue 之前定义的 jQuery 对象与当前文档元素失去了关联。
比如我先定义一个 oDiv = $("#id1"),对应的 DOM 里面 id=id1 的 div 元素(两者相关联)。
当我操作 oDiv 时,对应 DOM 里面的 id=id1 的 div 会相应变化。
这时候,我使用 Vue 对象。
在之后,我再操作 oDiv ,DOM 里面 id=id1 的 div 元素不再响应变化(两者断开关联,是两个不同的对象)。
这里估计是 Vue 监听 DOM 的时候做的一些操作导致的。
解决方案1:
绑定事件对 document 绑定
//对jQuery对象绑定事件 $(document).on("change", "#id", function () { //action…… });
解决方案2:
在 Vue 后面使用 jQuery