事件与处理程序

Posted 2023-04-11 wslxs

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了事件与处理程序相关的知识，希望对你有一定的参考价值。

事件程序的调用，在HTML中绑定

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function save()
            alert("保存按钮被单击")
        
        function doubleSave()
            alert("双击保存按钮被单击")
        
    </script>
</head>
<body>
    <input type="button" value="保存" name="save" onclick="save()">
    <input type="button" value="双击保存" name="save" ondblclick=" doubleSave()">
</body>
</html>

事件程序的调用2，在javascript代码中绑定，代码放在html下面，先执行html代码再执行javascript代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

</head>
<body>
    <input type="button" value="保存" name="save" id="save" ">
    <script>
        var save = document.getElementById("save");
        save.onclick=function()//匿名函数
            alert("点击了单击按钮");
        
    </script>
</body>
</html>