js中的事件绑定主要有三种方式:
① 行内绑定
② 动态绑定
③ 事件监听
今天在写系统注册页面时,出现了这样一个奇葩的问题:
我用第一种行内绑定的方式来实现一个选择框(选择不同的option会产生不同的操作来修改html界面),本来是非常顺利的,但在我修改了一些class和css样式之后,这种行内绑定的方式竟然莫名其妙的失效了:
html:
script:
如上图这种行内绑定的方式突然失效,但之后我将sChange()方法由html内部移到外部css文件中后,sChange()方法竟然再次生效:
.css:
然后,我又尝试了另一种事件绑定方式:动态绑定,结果内部调用和外部调用均可以实现
.css:
理想效果:
虽然经过js的修改可以解决问题,实现上图的效果,但我想弄明白其中的原因,所以总昨天晚上百度了一晚,看过了无数案例和解决方案,但仍然没有遇到过跟我一样的案例,今天又调试了一上午代码还是没有找到原因,所以希望有类似经历的小伙伴和知道原因的dalao能够伸出援手(救急),而我还会继续寻找原因,找到后会第一时间更新。