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

二、

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. [xsy2962]作业

    题意:$f_0=1-\dfrac1e,f_n=1-nf_{n-1}$,求$f_n(n\leq10000)$,保留四位小数 这题代码只有⑨行但是题解很神... 因为递推式中有乘法,所以直接按题目来推肯定 ...

  2. 计算数字出现的次数 Exercise07_03

    import java.util.Scanner; /** * @author 冰樱梦 * 时间:2018年下半年 * 题目:计算数字出现的次数 * */ public class Exercise0 ...

  3. STL之priority_queue3

    描述 使用STL中的优先队列,将n个点按照横坐标从小到大顺序排序,如果横坐标相同,按照纵坐标从小到大排序. 部分代码已经给出,请补充完整,提交时请勿包含已经给出的代码. int main() { in ...

  4. Problem X: 零起点学算法22——华氏摄氏温度转换

    #include<stdio.h> int main() { float f,c; while(scanf("%f",&f)!=EOF) c=*(f-); pr ...

  5. Spark机器学习：TF-IDF实例讲解

    测试数据源:20 Newsgroups (http://qwone.com/~jason/20Newsgroups/),其中包含20个领域的新闻,此次我们使用20news-bydate-train作为 ...

  6. python3中的range函数

    奇怪的现象 在paython3中 print(range(10)) 得出的结果是 range(0,10) ,而不是[0,1,2,3,4,5,6,7,8,9] ,为什么呢? 官网原话: In many ...

  7. JQurey中getJSON方法错误回调方法

    1.使用try...catch实现 2.换$.ajax 3.JQuery 1.5+可以这样使用: $.getJSON("example.json", function() { al ...

  8. TDiocpCoderTcpServer返回数据记录有条数限制的问题

    TDiocpCoderTcpServer返回数据记录有条数限制的问题 在使用TDiocpCoderTcpServer控件返回查询数据的时候,发现当记录条数超过一定数量的时候(比方有人反试图返回30万条 ...

  9. 使用ab.exe监测100个并发/100次请求情况下同步/异步访问数据库的性能差异

    ab.exe介绍 ab.exe是apache server的一个组件,用于监测并发请求,并显示监测数据 具体使用及下载地址请参考:http://www.cnblogs.com/gossip/p/439 ...

  10. Android -- 多媒体播放之MediaPlayer使用内部实现简析

    Android -- MediaPlayer内部实现简析 在之前的博客中,已经介绍了使用MediaPlayer时要注意的内容.如今,这里就通过一个MediaPlayer代码实例,来进一步分析Media ...