一、需求制作一个模拟对话框，

二、

1、需要发送后，输入框清空

2、按enter键可发送

三、代码部分

<!DOCTYPE HTML>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>无标题文档</title>

    <style>

        #div1 { width:240px; height:200px; border:1px solid #333; background:#f1f1f1; padding:10px; }

    </style>

    <script>

        window.onload = function (){

            var oDiv = document.getElementById('div1');

            var oStrong = document.getElementById('strong1');

            var oText = document.getElementById('text1');

            var oBtn = document.getElementById('btn1');

            var str='';

            function Say(){

                str += oStrong.innerHTML + oText.value +'<br>';

                oDiv.innerHTML = str;

                oText.value = '';

            }

            oBtn.onclick = Say;

            document.onkeydown=function(event){

                var e = event || window.event;

                if(e && e.keyCode==13){ // enter 键

                    Say();

                }

            };

        };

    </script>

</head>

<body>

<div id="div1"></div>

<strong id="strong1">张三：</strong>

<input id="text1" type="text" />

<input id="btn1" type="button" value="提交" />

</body>

</html>

　　

JS DOM -- 关于回车键盘事件执行事件的更多相关文章

  1. 用js写一个回车键盘事件

    用js来监听键盘事件,代码如下: <script type="text/javascript" language=JavaScript charset="UTF-8 ...

  2. js dom添加回车事件

    <!DOCTYPE html> <html lang="en" class="no-js"> <head> <meta ...

  3. 手机端点击键盘无法获取keyCode值的部分时隐藏键盘并执行事件

    用计时器监视window.innerHeight高度改变来判断.触发键盘其他地方也有事件反应 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

  4. 获取 js DOM元素中绑定的所有事件,模仿 chrome getEventListeners

    偶尔看到了这个问题,如何用JS获取元素某一事件上绑定的所有Listener? 突然觉得好像是有解决办法的,查了下,在 chrome 下,支持 window.getEventListeners(obj) ...

  5. js关闭或者刷新页面后执行事件

    onbeforeunload 使用方法 window.onbeforeunload=function(){ return ''; } 有返回值才能弹出显示,或者有需要执行的事件也行.

  6. js dom元素加载完成执行

    //dom ready执行 function ready(fn){ if(document.addEventListener){ document.addEventListener('DOMConte ...

  7. js Dom为页面中的元素绑定键盘或鼠标事件

    html鼠标事件 onload 页面加载 onclick 鼠标单击 onmouseover 鼠标移入 onmouseout 鼠标移出 onfocus 获取焦点 onblur 失去焦点 onchange ...

  8. JS DOM属性+JS事件

    DOM属性 console.log(ele.attributes) 获取ele元素的属性集合 ele.attributes.getNamesItem(attr).nodeValue 获取指定属性值 e ...

  9. js监听回车事件

    标题通俗的说,也就是绑定当用户按下回车键要执行的事件. 下面,入正题. 第一步,先编写简单的页面代码,这里我们只需要一个按钮就足够了.当然,还有按钮事件. <html> <head& ...

随机推荐

  1. 【最近公共祖先】【树链剖分】CODEVS 1036 商务旅行

    树链剖分求lca模板.O(log(n)),就是不倍增嘛~ #include<cstdio> #include<algorithm> using namespace std; # ...

  2. 5.2类集（java学习笔记）Map，Set接口

    一.Map接口 Map接口中存储数据是通过key->value的方式成对存储的,可以通过key找到value. 二.Map接口常用子类 1.HashMap HashMap是无序存放的,key不允 ...

  3. Scala零基础教学【1-20】

    基于王家林老师的Spark教程——共计111讲的<Scala零基础教学> 计划在9月24日内完成(中秋节假期之内) 目前18号初步学习到25讲,平均每天大约完成15讲,望各位监督. 初步计 ...

  4. 使用gettext提取c#中的多语言占位符（nopCommerce示例篇）

    i18n国际化通常的作法是使用gettext,即在源码中使用特殊的关键字来标识这个字符串将可能被翻译,如 @if (Model.IsCustomerForumModerator) { <li c ...

  5. JS面向对象之原型

    面向对象之原型 为什么要使用原型 由于 js 是解释执行的语言, 那么在代码中出现的函数与对象, 如果重复执行, 那么会创建多个副本, 消耗更多的内存, 从而降低性能 传统构造函数的问题 functi ...

  6. VB6的UTF8编码解码

    'UTF-8编码  Public Function UTF8Encode(ByVal szInput As String) As String     Dim wch  As String     D ...

  7. Android Studio使用过程中Java类突然报红，但项目可运行解决方案

    1.点击File->Invalidate Caches / Restart... 2.重启Gradle,清除缓存 3.Clean Project

  8. vue2计算属性computed

    详见vue2.0 API<计算属性> 需求: 模板内的表达式是非常便利的,但是它们实际上只用于简单的运算.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id=&qu ...

  9. SpringMVC中使用CommonsMultipartResolver进行文件上传

    概述: CommonsMultipartResolver是基于Apache的Commons FileUpload来实现文件上传功能的.所以在项目中需要相应的jar文件. FileUpload版本要求1 ...

  10. 表单提交时上传图片 表单ajax提交

    页面 <script type="text/javascript" src="js/jquery.form.js"></script>& ...