第85节:Java中的JavaScript 复习一下css: 选择器的格式: 元素选择器:元素的名称{} 类选择器:....边框:盒子的边框 外边距: 盒子和盒子之间的距离 轮播图 自动播放:每隔3秒切换,切换图片, // 点击弹框 // 确定事件,点击事件 // 通过事件定义函数 // 在函数里定义操作页面元素...-- 引入外部的js文件 --> javascript" src=".....:节点元素的子节点 attributes:节点的属性节点 getElementById(): 返回带有指定ID的元素 getElementsByTagName(): 返回包含带有指定标签名称的所有元素的节点列表...getElementsByClassName(): 返回包含带有指定类名的所有元素的节点列表 appendChild(): 把新的子节点添加到指定节点 removeChild(): 删除子节点 replaceChild
第十三章——JavaScript事件机制 JavaScript的事件机制:事件是JavaScript和DOM交互的桥梁,常见的click,load,mouseover都是事件的名字,事件发生时调用它的处理函数执行相应的...13.1 JavaScript事件的调用方式 13.1.1 在script标签中使用 点击按钮执行displayDate()函数,显示当前时间信息 <button...:onmousemove 当鼠标移动时,在状态栏显示鼠标的位置 javascript"> var x=0,y=0; function MousePlace()... 请输入你的英文名字: onkeyup="myFunction()"> 13.2.3 表单相关事件 获得焦点与失去焦点的事件...指定数组的最大长度 /*是否带有小数*/ function isDecimal(strValue) { var objRegExp = /^\d+\.
此方法目的用来防小白,稍微有点经验的站长绕过方法有很多。代码转载自: https://www.jianshu.com/p/fcb7747ec620判断浏览器窗户大小发生变化自动关闭网页是最骚的!...JavaScript"> //禁止页面选择以及鼠标右键 document.οncοntextmenu=function(){return false;};...= window.innerWidth; //禁用右键 document.oncontextmenu = function () { return false; }; //在本网页的任何键盘敲击事件都是无效操作...(防止F12和shift+ctrl+i调起开发者工具) window.onkeydown = window.onkeyup = window.onkeypress = function ()...event.keyCode = 0; event.returnValue = false; return false; } }; //如果用户在工具栏调起开发者工具
先从我做的功能界面开始说起: 本篇主要介绍的就是图中红框标记的搜索自动匹配功能。仔细想一想,有木有很熟悉,对,这功能其实就是跟你每天百度、谷歌这样的搜索功能一样。...每天都用到的搜索自动匹配功能 百度的搜索框(默认显示四条数据) 美团搜索框 美团.jpg 淘宝搜索框 首先,大概过程肯定是这样的:先从输入框中输入关键字,然后根据关键字在缓存或数据库取数据返回显示在下方区域...客户端通过ajax从服务端取得的数据。下面,我写个简书搜索自动匹配的例子,数据是事先定义好在脚本里的,当然,如果我有访问简书数据库的权限和账号密码,就可以动态的获取实时数据了。...知识点三 if(keycode == 38){} 常用按键码与按键关系对应表 知识点四 onKeyUp 事件:onkeyup 事件会在键盘按键被松开时发生。...整体思路及完整代码: 首先在输入框上注册keyup事件,然后在事件中获取我实现定义的data对象数组(一般实时数据通过ajax获取json对象)。
根据标签名获取标签对象(元素) 格式:document.getElementsByTagName('标签名') 特点:一次性可获取多个标签 JavaScript修仙之旅 欲练此功,...简单理解为:除法–响应机制 事件源:触发事件的元素(绝大多数标签都能作为事件源) 事件类型:列入 click 点击事件 时间处理程序:事件触发后要执行的到吗(事件函数) <!...= document.querySelector('input'); // 目标1:在单行文本框上注册keyup事件,将文本框中的内容输出到终端 /* input.onkeyup...alert(“消息”) BOM没有通用的标准,所以在各个浏览器上显示的效果不一样 window.confirm("消息") \ confirm("消息"):弹出带有确定和取消按钮的消息框 window.prompt...("提示信息") \ prompt("提示信息"):弹出带有提示消息的输入框 onload 事件(页面加载) 浏览器是从上向下解析html文档代码的,所以之前要求script标签写在body标签的最下面
AJAX 第一章:AJAX基础 概念:AJAX = Asynchronous JavaScript And XML(异步的 JavaScript 和 XML)。...最典型的一个案例是各大搜索引擎都应用的搜索关键字自动联想功能,当打开Google或者百度, 在搜索栏中输入关键字时, 会自动弹出很多和关键字相关的信息。...思路 1.当用户松开键盘(输入内容)时向服务器发送请求,处理事件是onkeyup; 2.服务器得到客户端的请求数据之后,去数据库查询结果,返回查询结果到客户端; 3.客户端得到响应数据之后,自动填充到自动提示区域...; 4.在选中内容上,光标悬停会有背景突出显示; 5.当我们单击某个内容的时候,内容显示到搜索框,整个提示区域关闭; 步骤 1.构建页面,onkeyup事件 搜索框的onkeyup事件; onkeyup事件 $(function () { $("#key").keyup(function () { //首选还是先判断文本框内容是否为空
个: JavaScript键盘事件 方法 说明 onkeydown 按下键事件(包括数字键、功能键) onkeypress 按下键事件(只包含数字键) onkeyup 放开键事件...(包括数字键、功能键) 三个事件的执行顺序如下:onkeydown -> onkeypress ->onkeyup。...3、表单事件 在JavaScript中,常用的表单事件有4种: JavaScript鼠标事件 事件 说明 onfocus 获取焦点事件 onblur 失去焦点事件 onchange...状态改变事件 onselect 选中文本事件 4、编辑事件 在JavaScript中,常见的编辑事件有3种: JavaScript编辑事件 方法 说明 oncopy 复制事件...5、页面相关事件 在JavaScript中,常用的页面相关事件有3种: JavaScript编辑事件 方法 说明 onload 页面加载事件 onresize 页面大小事件 onerror
只允许数字: <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace...(/\D/g,'')" > 只允许数字和小数点(IE 兼容,但火狐不兼容): <input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste...="if(isNaN(value))execCommand('undo')" > 火狐下js设计: JavaScript" type="text/javascript..."> function clearNoNum(event,obj){ //响应鼠标事件,允许左右方向键移动 event = window.event...if(event.keyCode == 37 | event.keyCode == 39){ return; } //先把非数字的都替换掉
event.returnValue = false; return false; } };//禁止F12 }) 方式二 javascript..."> //禁用右键(防止右键查看源代码) window.oncontextmenu=function(){return false;} //禁止任何键盘敲击事件(防止F12和...shift+ctrl+i调起开发者工具) window.onkeydown = window.onkeyup = window.onkeypress = function () {...window.event.returnValue = false; return false; } //如果用户在工具栏调起开发者工具,那么判断浏览器的可视高度和可视宽度是否有改变
AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。 AJAX = 异步 JavaScript 和 XML。...GoogleSuggest 使用 AJAX 创造出动态性极强的 web 界面:当您在谷歌的搜索框输入关键字时,JavaScript 会把这些字符发送到服务器,然后服务器会返回一个搜索建议的列表。...当发送一个请求后,客户端需要确定这个请求什么时候会完成,因此,XMLHttpRequest对象提供了 onreadystatechange //事件机制来捕获请求的状态,继而实现响应。...q (带有输入框的内容) if(str.length==0) { document.getElementById("txtHint").innerHTML=""; return; } if...该函数由 "onkeyup" 事件触发: First name:onkeyup="showHint(this.value)" /> </form
not-allowed; } 设置禁用NoScript 禁用掉键盘的全部按键...(event) { if (window.event) { //alert("不允许使用任何键盘按键"); return false; } } }); 实现全屏爆炸:这段代码很简单,当按下调试键的时候...(慎用) javascript"> window.onkeydown = window.onkeyup = window.onkeypress = function..."> // 临时性,禁用F12调试器 window.onkeydown = window.onkeyup = window.onkeypress = function (event) { //...// 为右键添加自定义事件,禁用菜单右键!
JavaScript: 1. ECMAScript: 2. BOM: 3. DOM: 1....与弹出框有关的方法: alert() 显示带有一段消息和一个确认按钮的警告框。...confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。...Location:地址栏对象 1. 创建(获取): 1. window.location 2. location 2....键盘事件: 1. onkeydown 某个键盘按键被按下。 2. onkeyup 某个键盘按键被松开。
什么是JavaScript? JavaScript 是⼀种客户端脚本语⾔。...事件 事件三要素: 事件源 事件 事件驱动程序 常用的事件: onabort 图像的加载被中断。 onblur 元素失去焦点。 onchange 域的内容被改变。...onkeyup 某个键盘按键被松开。 onload 一张页面或一幅图像完成加载。 onmousedown 鼠标按钮被按下。 onmousemove 鼠标被移动。...协议 一般是http、https search 查询字符串 location.assign() 改变浏览器地址栏的地址,并记录到历史中 设置kk 就会调用assign()。...一般使用kk 进行页面之间的跳转 location.replace() 替换浏览器地址栏的地址,不会记录到历史中 location.reload() 重新加载 Navigator 对象 Navigator
onchange触发事件必须满足两个条件: a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效) b)当前对象失去焦点(onblur); 也就是说并不是我们在打字的时候就会触发...,而是在打完这后,焦点移出去之后,才触发;只有人工触发才有效,如果利用 JavaScript 程序改变是没有效果的。...onpropertychange 只要当前对象属性发生改变,都会触发事件,但是它是IE专属的; 在textarea中,如果想捕获用户的键盘输入,用onkeyup检查事件就可以了,但是onkeyup...,而是在打完这后,焦点移出去之后,才触发;只有人工触发才有效,如果利用 JavaScript 程序改变是没有效果的。...onpropertychange 只要当前对象属性发生改变,都会触发事件,但是它是IE专属的; 在textarea中,如果想捕获用户的键盘输入,用onkeyup检查事件就可以了,但是onkeyup
1、文本框焦点问题 onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 OnseleCT:当文字加亮后,产生该文件...onkeyup:每改变,就产生该文件 οnfοcus=”if(value==’文本框里的字’) {value=”}” οnblur=”if (value==”) {value=’文本框里的字’}”>点击时文字消失...window.resizeTo(300,283); 8.使文字上下滚动 οnmοuseοver=’this.stop()’ οnmοuseοut=’this.start()’ height=60> 共和国 9.状态栏显示该页状态...10.可以点击文字实现radio选项的选定 id=”A03″> 情侣 : 一次注册两个帐户 11.可以在文字域的font写onclick事件 12.打印打印网页 13.线型输入框 name=”key...19.打印页面 class=content href=”javascript:doPrint();”>打印本稿 20.可以直接写html语言 document.write(“”); http://blog.sina.com.cn
(标记的名称); 根据标记的name属性值获取元素对象:document.getElementsByName(name属性对应的值); 1.2 JavaScript概述 什么是JavaScript...JavaScript和java的区别: 1.javaScript是网景的产品,java是sun公司额产品,现在是oracle 2.javascript的运行只要系统里面有浏览器就可以,java的运行依赖于虚拟机...Javascript的组成: 1.EcmaScript:规范了js的基本语法。...; } 常用事件: 点击事件:onclick 失去焦点事件:onblur 获取焦点:onfocuse 键盘事件:onkeyup onkeydown onkeypress 页面加载事件:onload...2.时间:onkeyup键盘松开触发事件,调用对应的函数 Onsubmit提交事件(提交按钮),调用对应的函数 3.正则表达式和正则校验。
*将浏览器的各个组成部分封装成对象 2.组成: Window:窗口对象 Navigator:浏览器对象 Screen:显示器屏幕对象 History:历史记录对象 Location:地址栏对象 Window...:窗口对象 1.创建 2.方法 1.与弹出框有关的方法: alert()显示带有一段消息和一个确认按钮的警告框 confirm()显示带有一段消息以及确认按钮和取消按钮的对话框...方法名(); 4.Location:地址栏对象 1.创建(获取): 1.window.location 2.location 2.方法:...*常见的事件: 1.点击事件: 1.onclick:单击事件 2.onblclick:双击事件 2.焦点事件 1.onblur:失去焦点...onmouseup 鼠标按键被松开 onmousemove 鼠标被移动 5.键盘事件 1.onkeydown 某个键盘按键被按下 2.onkeyup
Window对象 window作为全局变量,代表了脚本正在运行的窗口,将属性与方法暴露给JavaScript。 Window对象属性 closed: 表示所引用的窗口是否关闭。...self: 返回对当前窗口的引用。 status: 设置窗口状态栏的文本。 top: 返回窗口层级最顶层窗口的引用。...confirm(): 显示带有一段消息以及确认按钮和取消按钮的对话框。 focus(): 把焦点给予一个窗口。 getComputedStyle(): 获取指定元素的CSS样式。...onerror: 当发生JavaScript运行时错误与资源加载失败时触发。 onabort: 发送到window的中止abort事件的事件处理程序,不适用于Firefox 2或Safari。...onkeyup: 某个键盘按键被松开后触发。 onkeypress: 某个键盘按键被按下并松开后触发。
的键盘事件 非 element-UI 组件,直接 @keyup.enter 就可以。...搜索" type="text" @keyup.enter="searchEnterFun"> 在methods方法里,写上监听的方法,当获取的keyCode 为13...keyCode属性返回onkeypress事件触发的键的值的字符代码,或者 onkeydown 或 onkeyup 事件的键的代码 注意: 在 Firefox 中,keyCode 属性在 onkeypress...事件中是无效的 (返回 0)。...e.keyCode:e.which; which 属性返回onkeypress事件触发的键的值的字符代码,或者 onkeydown 或 onkeyup 事件的键的代码
领取专属 10元无门槛券
手把手带您无忧上云