页面内容：文本框模拟键盘点击   div元素实现移动；

<body>

<textarea id="myarea"></textarea>

<hr>

<div id="mydiv" title="dddddiv"></div>

</body>

div样式可以自行定义；

JS脚本代码如下：

当键盘输入'a'或'A'时，div向左移动10px

<script type="text/javascript">

var myarea = document.getElementById("myarea");

var mydiv = document.getElementById("mydiv");

//event是键盘事件对象，能后识别按下的是哪个键

var a = mydiv.offsetLeft;

//var a = mydiv.offsetWidth;

//var a = window.getComputedStyle(mydiv).left;;

myarea.onkeypress = function(event) {

//alert(event.keyCode);

//var odiv = document.getElementById(“mydiv”);

//alert(odiv.getAttribute(“title”));

if(event.keyCode == "65"|| event.keyCode == "97") {

a=a-10;

//var b = a + “px”;

//alert(a);

var i = "20px"

mydiv.style.left = a + "px";

}

}

</script>

　　

JS通过键盘点击事件实现div移动的更多相关文章

  1. js触发按钮点击事件

    js触发按钮点击事件 博客分类: javascript   模拟JS触发按钮点击功能 <html> <head> <title>usually function&l ...

  2. js中的点击事件（click）的实现方式

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  3. js input radio点击事件

    html代码: <input type="radio" name="myname" value="1" />1 <inpu ...

  4. bootstrap table 生成的表格里动态添加HTML元素按钮，JS中添加点击事件，点击没反应---解决办法

    bootstraptable中onExpandRow属性---js  方法添加的 html代码,然后给这代码里面的 元素 添加 事件,却获取不该元素.(称之为未来元素),由于是未来的 所以现在没有这个 ...

  5. JS控制鼠标点击事件

    鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口.大体的意思就是这样,直接上代码了,简单易懂. <!DOCTY ...

  6. js模拟自动点击事件

    1.直接上代码很直观 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

  7. js/jquery 禁用点击事件

    前言 工作中经常遇到这种情况:验证邮箱页面的重新发送需要在3分钟后才可以点击触发请求,所以在这之前需要禁用他的点击. 网上查了后有以下几种实现方法 1.css禁用鼠标点击事件 .disabled { ...

  8. js 触发LinkButton点击事件，执行后台方法

    页面 <asp:LinkButton ID="lbtButton" runat="server"  CssClass="lbtButton&qu ...

  9. jq再次封装自己的ajax & js 回调函数 & js方法注释&js 全局屏蔽点击事件及a标签

    1.封装成一个独立JS var commonUrl = 'http://xx.xxx.com/'; function http({ url, type = "post", data ...

随机推荐

  1. SkylineGlobe TEPro 6.6.1 二次开发导出KML或者KMZ文件示例代码

    其实Skyline的fly文件跟kml文件很像很像,只不过一个是编码加密的,另一个早已经成为OGC的通用标准: 喜欢Skyline的小伙伴们试试下面的代码吧,细心的人能发现彩蛋哦. <!DOCT ...

  2. virtualbox - 2台虚拟机之间通过ssh互访

    virtualbox 5.2.12 一台虚拟机是Debian 9,另一台是Ubuntu 18.04. 注意: 2台虚拟机系统里要安装ssh ! sudo apt install ssh 然后在virt ...

  3. VB6 加密解密字符串

    Public Function EnCodeStr(ByVal password As String) As String Dim il_bit, il_x, il_y, il_z, il_len, ...

  4. React Native 教程：001 - 如何运行官方控件示例 App

    原文发表于我的技术博客 本文主要讲解了如何运行 React Native 官方控件示例 App,包含了一些 React Native 的基础知识以及相关环境的配置. 原文发表于我的技术博客 React ...

  5. Mysqldump备份说明及数据库备份脚本分享-运维笔记

    MySQLdump是MySQL自带的导出数据工具,即mysql数据库中备份工具,用于将MySQL服务器中的数据库以标准的sql语言的方式导出,并保存到文件中.Mysqldump是一个客户端逻辑备份的工 ...

  6. 变量 var &函数new

    声明变量 变量:变量是存储信息的容器,创建变量通常称为"声明"变量 变量必须以字母开头(小驼峰式myName): 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做): 变量名 ...

  7. c++ 中关于一些变量不能声明的问题

    j0,j1,jn,y0,y1,yn被c++中某些函数占用了,所以是不能被声明的,今天就遇到了这个问题,结果我在自己写的程序中找了半天都没找到重复申明的y1

  8. 对spring cloud config的一点理解

    以下部分纯属个人理解,但是结果都是经过demo验证. 一.spring cloud config介绍 spring cloud是spring家族中的一个微服务工具包,其中包含了很多微服务的工具.偏向于 ...

  9. linux及安全第三周总结——跟踪分析LINUX内核的启动过程

    linux内核目录结构 arch目录包括了所有和体系结构相关的核心代码.它下面的每一个子目录都代表一种Linux支持的体系结构,例如i386就是Intel CPU及与之相兼容体系结构的子目录.PC机一 ...

  10. linux 下gcc 编译结构体问题

    最近在linux 学习c语言的编程,发现好多原来在vs 上的在linux 都编译不过去,今天就遇到了一个问题就是结构体的编译的问题, 结构体大概的定义是 struct Node{ int a; int ...