给submit提交按钮添加点击事件（JavaScript）

快来打我* 2022-09-30 00:45 276阅读 0赞

<!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>IFE JavaScript Task 01</title>
      </head>
    <body>
    
      <label>请输入北京今天空气质量：<input id="aqi-input" type="text"></label>
      <button id="button">确认填写</button>
    
      <div>您输入的值是：<span id="aqi-display">尚无录入</span></div>
    
    <script type="text/javascript"> (function() { /* 在注释下方写下代码 给按钮button绑定一个点击事件 在事件处理函数中 获取aqi-input输入的值，并显示在aqi-display中 */ })(); </script>
    </body>
    </html>

--------------------

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>IFE JavaScript Task 01</title>
    </head>
    <body>
    <label>请输入北京今天空气质量：<input id="aqi-input" type="text"></label>
    <button id="button">确认填写</button>
    <div>您输入的值是：<span id="aqi-display">尚无录入</span></div>
    <script type="text/javascript"> window.onload = prepare; function prepare(){ if (!document.getElementById){ return false; }//检查浏览器是否支持document.getElementById的DOM方法 var submit = document.getElementById("button"); submit.onclick = function(){ clickButton(); }//添加事件处理函数,把onclick事件绑定到ID为"button"元素上 } function clickButton(){ var output = document.getElementById("aqi-display"); var input = document.getElementById("aqi-input"); text = input.value;//获取ID为"aqi-input"的值 output.innerHTML = text;//把值写入ID为"aqi-display"之中 } </script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，276人围观）

还没有评论，来说两句吧...

相关阅读

相关帆软给图形添加点击事件

setTimeout(function() \{ var c = document.getElementsByTagName("linearGradient")\[

布满荆棘的人生/ 2022年12月13日 01:44/ 0 赞/ 554 阅读

相关使用事件代理：单选按钮 --点击添加样式

事件代理：父子组件传值含义：将子元素的事件通过冒泡的形式交由父元素来执行原理：事件委托是利用事件的冒泡原理来实现的 Event对象提供了一个属性叫target，可

本是古典何须时尚/ 2022年12月10日 14:31/ 0 赞/ 169 阅读

相关 Vue + ElementUI 给el-table添加点击事件

可以分三种情况实现点击事件 1. 针对整行点击 `@row-click=""` <el-table :data="userList" hi

古城微笑少年丶/ 2022年12月10日 02:27/ 0 赞/ 698 阅读

相关 java按钮点击事件监听_按钮事件监听

\[java\]代码库/\\ \ 功能：按钮事件监听 \/ package com.test; import java.awt.\; import javax.swi

快来打我*/ 2022年11月04日 00:46/ 0 赞/ 299 阅读

相关 html 提交按钮(input submit)

submit默认是提交表单,跳转页面或刷新(跳转到本页),可以用`prevent`来阻止 <form> <input name="key">

我会带着你远行/ 2022年10月27日 01:42/ 0 赞/ 223 阅读

相关给submit提交按钮添加点击事件（JavaScript）

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <titl

快来打我*/ 2022年09月30日 00:45/ 0 赞/ 277 阅读

相关 JavaScript 点击事件

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>点

逃离我推掉我的手/ 2022年07月13日 05:51/ 0 赞/ 261 阅读

相关监听按钮点击事件

3中注册监听方式比较 1.匿名内部类需要获取控件对象，使用变量不方便；适用于单个事件 2.实现接口需要获取控件对象，使用变量方便；适用于于多个事件 3.设置onC

怼烎@/ 2022年07月12日 12:45/ 0 赞/ 318 阅读

相关给RecyclerView的Item添加点击事件

RecyclerView监听事件处理在ListView使用的时候，该控件给我们提供一个onItemClickListener监听器，这样当我们点击Item的时候，会回调相关的方

淩亂°似流年/ 2022年05月23日 05:54/ 0 赞/ 287 阅读

相关 JavaScript submit 事件

JavaScript submit 事件表单中提交按钮被点击会触发submit事件。由于表单提交是最为频繁的页面操作之一，且submit事件有一些细节需要特别注意。...

小灰灰/ 2020年06月02日 14:58/ 0 赞/ 436 阅读