HTML之JavaScript Form表单事件

HTML之JavaScript Form表单事件

html 复制代码
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function onSubmitEvent(event) {
            /*
                弹窗的三种方式:
                    alert() 信息提示框
                    prompt()信息输入框
                    confirm()信息确认框
            */
            var flag = confirm("1121")
            return flag;
            // event.preventDefault();
        }
        function aa() {
            console.log('触发重置') 
        }
        function focus1() {
            console.log("获得焦点")
        }
        function blur1() {
            console.log("失去焦点")
        }
        function change(value) {
            console.log("内容改变为:" + value)
        }

    </script>
</head>

<body>
    <form action="js中使用JSON.html" onsubmit="return onSubmitEvent(event)" onreset="aa()" method="post"> <!--onsubmit表示提交事件,由按钮type为submit触发;onreset为重置表单事件,由按钮type为reset触发-->
        111:<input type="text" name="111" onfocus="focus1()" onblur="blur1()" onchange="change(this.value)" />
        <select name="122">
            <option value="1">qq</option>
        </select>
        <input type="submit" value="提交" />
        <input type="reset" value="重置" />
    </form>
</body>

</html>
相关推荐
Moment13 分钟前
通过爬取 B 站热门视频来带你彻底了解 Playwright 🤷🏿‍♂️🤷🏿‍♂️🤷🏿‍♂️
前端·javascript·后端
Java~~29 分钟前
山东大学软件学院项目实训-基于大模型的模拟面试系统-前端美化滚动条问题
前端
掘金安东尼40 分钟前
🧭 前端周刊第411期(2025年4月21日–27日)
前端·javascript·面试
喝养乐多长不高1 小时前
详细PostMan的安装和基本使用方法
java·服务器·前端·网络协议·测试工具·https·postman
阿珊和她的猫1 小时前
React 与 Vue 的区别:你会选择哪个框架呢
前端·vue.js·react.js
尖椒土豆sss1 小时前
Nuxt3框架入门:第一个简单demo
前端·nuxt.js
浪裡遊1 小时前
前端高频面试题day2
前端·javascript·vue.js
独立开阀者_FwtCoder1 小时前
Vue3 首款 3D 数字孪生编辑器 正式开源!
前端·javascript·vue.js
晓得迷路了1 小时前
栗子前端技术周刊第 78 期 - React Compiler RC、Trae MCP、pnpm 10.9...
前端·javascript·trae