函数的事件
作者：互联网
<body>
<!-- 单双击事件 -->
<input type="button" onclick="singleClick('龙')" ondblclick="doubleClick()" value="单双击"><br>
<div id="d"></div>
<button id="btn">唐</button>
<input type="button" onclick="singleClick()" ondblclick="doubleClick('龙1')" value="唐2">
<div id="id"></div>
<!-- 变化事件 -->
<input type="text" id="a" onchange="change()" value="">
<br>
<input type="button" value="唐3">
<br>
<div id="message"></div>
<!-- 提交事件 -->
<form action="" onsubmit="login1()">
账号: <input type="text" name="name"><br>
密码: <input type="password" name="password"><br>
<input type="submit" value="登录">
</form>
<!-- 当前组件 -->
<input type="button" onclick="singleClick(this)" value="按钮1"><br>
<input type="button" onclick="singleClick(this)" value="按钮2">
<br>
<div id="b"></div>
<!-- 阻止事件的发生 --> <form action="" onsubmit=" return login()"> 账号: <input type="text" name="name" id="name"><br> 密码: <input type="password" name="password" id="password"><br> <input type="submit" value="登录"> </form>
<script> var btn = document.getElementById('btn');
//事件类型 如何触发 什么事件 比如鼠标点击(onclick)还是鼠标经过 还是键盘按下 //事件处理程序 通过一个函数赋值的方式 完成 btn.onclick = function () { alert('1龙涛'); } //单双击按钮 单击:onclick="singleClick()";双击：ondblclick="doubleClick()" function singleClick(d) { document.getElementById('d').innerHTML = d; }
function doubleClick() { var c = '龙'; document.getElementById('d').innerHTML = c; }
function singleClick() { //函数里没有参数 var id = "龙"; document.getElementById('id').innerHTML = id; }
function doubleClick(id) { //函数里有参数 // var id= "双击按钮"; document.getElementById('id').innerHTML = id; } //变化事件 onchange function change() {
var message = document.getElementById('message');
var a = document.getElementById('a'); message.innerHTML = "唐3:" + a.value; }
//提交事件 onsubmit
function login1() { alert('提交表单'); } //当前组件 function singleClick(button) { //button只是参数 //var s = "被点击的按钮是：" + button.value; document.getElementById('b').innerHTML = "被点击的按钮是：" + button.value;; }
//阻止事件的发生 function login() { var name = document.getElementById('name'); var password = document.getElementById('password'); if (name.value.length == 0) { alert("用户名不能为空"); return false; } else if (password.value.length == 0) { alert("密码不能为空"); return false; } return true; }
//下拉菜单 </script> </body>
<!-- 阻止事件的发生 --> <form action="" onsubmit=" return login()"> 账号: <input type="text" name="name" id="name"><br> 密码: <input type="password" name="password" id="password"><br> <input type="submit" value="登录"> </form>
<script> var btn = document.getElementById('btn');
//事件类型 如何触发 什么事件 比如鼠标点击(onclick)还是鼠标经过 还是键盘按下 //事件处理程序 通过一个函数赋值的方式 完成 btn.onclick = function () { alert('1龙涛'); } //单双击按钮 单击:onclick="singleClick()";双击：ondblclick="doubleClick()" function singleClick(d) { document.getElementById('d').innerHTML = d; }
function doubleClick() { var c = '龙'; document.getElementById('d').innerHTML = c; }
function singleClick() { //函数里没有参数 var id = "龙"; document.getElementById('id').innerHTML = id; }
function doubleClick(id) { //函数里有参数 // var id= "双击按钮"; document.getElementById('id').innerHTML = id; } //变化事件 onchange function change() {
var message = document.getElementById('message');
var a = document.getElementById('a'); message.innerHTML = "唐3:" + a.value; }
//提交事件 onsubmit
function login1() { alert('提交表单'); } //当前组件 function singleClick(button) { //button只是参数 //var s = "被点击的按钮是：" + button.value; document.getElementById('b').innerHTML = "被点击的按钮是：" + button.value;; }
//阻止事件的发生 function login() { var name = document.getElementById('name'); var password = document.getElementById('password'); if (name.value.length == 0) { alert("用户名不能为空"); return false; } else if (password.value.length == 0) { alert("密码不能为空"); return false; } return true; }
//下拉菜单 </script> </body>
标签：function,函数,innerHTML,getElementById,事件,var,document,id 来源： https://www.cnblogs.com/tljlt/p/16311352.html