js中的事件绑定主要有三种方式:

① 行内绑定

② 动态绑定

③ 事件监听


今天在写系统注册页面时,出现了这样一个奇葩的问题:

我用第一种行内绑定的方式来实现一个选择框(选择不同的option会产生不同的操作来修改html界面),本来是非常顺利的,但在我修改了一些class和css样式之后,这种行内绑定的方式竟然莫名其妙的失效了:

html:

创新实训——html中的内部js方法调用失效问题

script:

创新实训——html中的内部js方法调用失效问题


如上图这种行内绑定的方式突然失效,但之后我将sChange()方法由html内部移到外部css文件中后,sChange()方法竟然再次生效:

创新实训——html中的内部js方法调用失效问题

.css:

创新实训——html中的内部js方法调用失效问题



然后,我又尝试了另一种事件绑定方式:动态绑定,结果内部调用和外部调用均可以实现

创新实训——html中的内部js方法调用失效问题

.css:

创新实训——html中的内部js方法调用失效问题


理想效果:

创新实训——html中的内部js方法调用失效问题创新实训——html中的内部js方法调用失效问题



虽然经过js的修改可以解决问题,实现上图的效果,但我想弄明白其中的原因,所以总昨天晚上百度了一晚,看过了无数案例和解决方案,但仍然没有遇到过跟我一样的案例,今天又调试了一上午代码还是没有找到原因,所以希望有类似经历的小伙伴和知道原因的dalao能够伸出援手(救急),而我还会继续寻找原因,找到后会第一时间更新。

相关文章:

  • 2022-12-23
  • 2021-12-03
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-12-18
  • 2021-12-03
猜你喜欢
  • 2021-09-06
  • 2022-12-23
  • 2022-12-23
  • 2021-11-20
  • 2021-07-23
  • 2022-01-07
  • 2021-08-05
相关资源
相似解决方案