html中onclick事件的介绍与用法
墨初 Web前端 2136阅读
前端web页面的html元素中,如果设置了onclick属性,那么这个元素就可以通过鼠标点击的方式来触发某个js事件,这个事件就被称作为onclick事件,下面就简单的介绍一下onclick定义与用户。
HTML onclick 事件
onclick:为html DOM属性对象中的事件对象,此事件会在元素被鼠标点击时发生。
语法:
<element onclick="SomeJavaScriptCode">
参数:
SomeJavaScriptCode:为JS的代码,一般定义会JS的一个函数
HTML onclick 事件使用示例
例1:
<button onclick="hello()">点击我</button> <script> function hello() { alert('hello 73so.com !'); } </script>
鼠标点击“点击我”按钮,就会执行下面JS代码中自定义函数“hello()”,并弹出一个 alert 类型的提示。
例2:
onclick 事件在调用js的函数时,是可以向函数传递一个值,这个值可以是某个自定义的字符串,也可以是被点击元素的自身。
<button onclick="hello(this)">点击我</button> <script> function hello(e) //这里的 e 就上面传入的this , this 表示被点击元素的本身 { var txt = e.innerHTML; alert('你点击一个名为"'+txt+'"的按钮!'); } </script>
例3:
onclick 事件除了将被点击元素传入到处理函数中外,还可以传入一个自定义的参数值。
<button onclick="hello('73so.com')">点击我</button> <script> function hello(e) //这里的 e 就上面传入的this , this 表示被点击元素的本身 { alert('Hello ,'+e); } </script>