欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

使用JavaScript修改组件中onclick事件所执行的方法

程序员文章站 2022-05-12 17:34:03
...
之前在项目中经常会遇到一种情况,点击同一个html组件,执行不同的方法或者功能。所以就自己写了如下的方法,比较笨,但是还可以执行。

核心代码如下:

1. <script>

2. <!--

3. /*

4. * 功能:使用JavaScript修改组件中onclick事件所执行的方法

5. * 创建者:FrancisRan

6. * 创建时间:2010-07-30

7. * 最后修改时间:2010-07-30

8. * copyright (c)2010 ranfanwei1988@126.com

9. */

10.

11. //修改onclick事件的值

12. function addEvent () {

13. alert("修改前的onclick:\n\n" + document.getElementById("eventTest").onclick);

14.

15. //修改eventTest组件的onclick值

16. document.getElementById("eventTest").onclick = alertEvent2;

17.

18. alert("修改后的onclick:\n\n" + document.getElementById("eventTest").onclick);

19. alert("修改成功,单击“弹出”按钮查看效果");

20. }

21.

22. //修改前的事件

23. function alertEvent () {

24. alert("这是没有删除触发的事件");

25. }

26.

27. //修改后的事件

28. function alertEvent2 () {

29. alert("这是删除后触发的事件");

30. }

31. -->

32. </script>

33.

34. <input type = "button" id = "eventTest" onclick = "alertEvent ()" value = "弹出" />

35. <input type = "button" onclick = "addEvent ()" value = "修改" />

相关标签: JavaScript