JS元素意外点击元素消失
<!DOCTYPE html> <html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{margin: 0;padding: 0}
a{ display: inline-block; width: 50px;height: 50px;background: #f40;margin: 50px 0 0 50px;}
div{margin: 60px 0 0 50px; padding: 20px;outline: none;border:1px solid #eee;border-radius: 5px;width: 200px;}
</style>
</head>
<body>
<a id="search">1111</a>
<div id="searchBox"></div>
<script type="text/javascript">
window.onload = function(){
var obj=document.getElementById("searchBox");
var oBtn=document.getElementById("search");
searchBox.style.display = "none";
oBtn.onclick=function(){
obj.style.display="block";
}
document.onclick=function(event){
//
var e=event || window.event;//兼容ie和非ie的event
var aim=e.srcElement || e.target; //兼容ie和非ie的事件源
//
if(e.srcElement){
var aim=e.srcElement;
if(aim!=oBtn && aim!=obj){
obj.style.display="none";
}
}else{
var aim=e.target;
if(aim!=oBtn && aim!=obj){
obj.style.display="none";
}
}
}
}
</script>
</body>
</html>
JS元素意外点击元素消失的更多相关文章
- 【笔记】js获取当前点击元素的索引
以前用jq 做过图片切换 滑动之类的特效现在想用js 试试是怎么一回事 jq图片切换的思路是用index()函数获取当前点击的按钮的索引然后根据索引值将对应索引的图片显示出来 于是查了一下js 是如何 ...
- JS初学之-点击元素,当前的显示样式,其他变灰色
点击按钮或者其他元素,当前的变化,其他的不变(比如选项卡按钮,点击当前的变为黄色,其他的不变色),这样的情况我们有两种思路: 1.全部清空,当前添加 for(var i=0;i<aBtn.len ...
- js单击显示元素,点击元素本身以外隐藏元素
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js获取当前点击元素的索引
以ul下的li元素为例:获取li的索引,代码如下: <ul id="list"> <li></li> <li></li> ...
- 自动化测试中,元素无法点击定位等问题的解决:js的使用方法
在自动化测试中经常会遇到使用selenium方法定位元素点击操作失败的情况,例如,我们想实现在浏览器输入http://www.baidu.com,进入百度首页后,鼠标悬停在“更多产品”上,点击“全部产 ...
- JS 点击元素发ajax请求 打开一个新窗口
JS 点击元素发ajax请求 打开一个新窗口 经常在项目中会碰到这样的需求,点击某个元素后,需要发ajax请求,请求成功以后,开发需要把链接传给前端(或者说请求成功后打开新窗口),前端需要通过新窗口打 ...
- js中怎么为同级元素添加点击事件
事件件是javascript脚本语言的重要组成部分,因为有事件才使用户页面的体验更加的美好.元素添加事件是js语言中最基础的.我们可以为元素本身添加事件,也可以通过事件绑定和事件监听为元素的父元素和子 ...
- js:for循环ul/li,获取当前被点击元素的id,以及给其他li设置属性
js:for循环ul/li,获取当前被点击元素的id,以及给其他li设置属性 <!doctype html> <html> <head> <meta char ...
- js怎么模拟点击网页元素
在测试页面中,引入jquery源文件,并添加一个div标签,一个a标签,为了演示效果a标签暂时不添加地址 通过jquery为div标签绑定一个点击事件,这个事件是被动执行的.意思是要点击才会触发的 在 ...
随机推荐
- [MySQL]子语句的查询技巧
一.统计group by语句的行数 group by语句中,如果包含字段统计函数(诸如:count(),sum()...),这种情况下统计函数只会作用于group by的字段,因此想拿到最终结果的行数 ...
- Django makemigrations 不行时
- 14)django-模板(计数器)
模块中for循环自带计数器. 使用场景:表格数据相增加序列号. 问:可以使用表的自增加序列做为序列号,但是这个存在个问题,即表中数据被删除,则会出现序列不连续. 1)每个循环都有6个公共方法,双循环有 ...
- DecimalFormat详解
DecimalFormat继承自NumberFormat,可以使用它将十进制的数以不同形式格式化为字符串形式,可以控制前导和尾随0.前缀.后缀.分组(千).小数分隔符等,如果要更改格式符号(例如小数点 ...
- 支付宝调用错误:Call to undefined function openssl_sign()
打开php.ini,找到这一行 ;extension=php_openssl.dll,将前面的“;”去掉:重启服务器
- Webform中<%%>
其实<%%>很早之前就见过了,只是会用一点功能,其它的不甚了解.今天偶尔见到了它的庐山真面目,现在共享给大家. 语法 代码块呈现(<%%>)定义了当呈现页时执行的内联代码或内联 ...
- 瑞联科技:Pwp3框架 调用存储过程返还数据集合 到前端界面展示
一:代码结构: 1:Js 代码结构 2:Java 代码结构 二:前端界面展示效果 为了数据安全性:界面数据做了处理 三:全端代码展示 1:main.vop <html> <head& ...
- Confluence 6 数据库和临时目录
数据库 所有的其他数据库,包括有页面,内容都存储在数据库中.如果你安装的 Confluence 是用于评估或者你选择使用的是 Embedded H2 Database 数据库.数据库有关的文件将会存储 ...
- spark submit参数及调优
park submit参数介绍 你可以通过spark-submit --help或者spark-shell --help来查看这些参数. 使用格式: ./bin/spark-submit \ ...
- 【sqli-labs】Less5~Less6
双注入原理: 来源: http://www.myhack58.com/Article/html/3/7/2016/73471.htm (非常详细的说明了原理,good) http://www.2cto ...