用js代码修改checkbox的checked属性值不会触发onchange事件

问题描述

1. vue中，我用 v-model 将 checkbox 绑定到变量 flag 上，但是，当我用 js 去修改 flag 的值时，却没有触发 checkbox 的 v-on:change 事件。
2. 同样的，在angular中用ng-model将 checkbox 绑定到变量 flag2 上，用程序修改flag2 的值也没有触发 checkbox 的 ng-change 事件。

     事实上，这不是vue和angular的问题，而是在原生的js和html上。

解决方法

1. 在vue及angular框架中我们可以通过watch监听绑定的变量的值的变化来实现change事件要捕获的事件处理。
2. 分别在以下两处都添加处理方法代码：
     (1) onchange事件中处理用户界面的操作；
     (2) 代码修改checkbox的checked属性值的时候后面直接添加处理方法。

结论

1. 用 js 代码去修改 checkbox 的 checked 属性值不会触发change或click事件;
2. 用 js 代码去修改text的value值，不会触发change事件。

     以上需要我们特别注意。

补充知识

    测试了下，用户界面操作会触发，用 js 修改以下相关控件的checked、value值不会触发以下相关事件：

• select的onchange：
• input[type="checkbox"]的onchange
• input[type="text"]的onchange

    我猜测可能HTML在设计之初已考虑到了防止代码加载数据到表单时可能出现事件连锁触发反应（这也算是好的方面吧），完全放开由程序实现时去考虑是否需要调用和触发。