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标签绑定一个点击事件,这个事件是被动执行的.意思是要点击才会触发的 在 ...
随机推荐
- h5 右下角浮动按钮, 纯css实现
2017年11月22日19:00:22 效果: 代码: /** 右下角跳转按钮 跳转到列表 */ #list_note_icon { position: fixed; ...
- ES6 必须要用的数组Filter() 方法,不要再自己循环遍历了!!!
1,来一个最简单最常用的栗子: 获得年龄为9岁的孩子 1 let arr = [ 2 { 3 name:'小明', 4 sex:0, 5 age:9 6 }, 7 { 8 name:'小红', 9 s ...
- Vue2.0 新手完全填坑攻略—从环境搭建到发布
http://www.open-open.com/lib/view/open1476240930270.html https://jingyan.baidu.com/article/91f5db1b2 ...
- bs4
- Mybait缓存机制
MyBatis同大多数ORM框架一样,提供了一级缓存和二级缓存的支持. 一级缓存:其作用域为session范围内,当session执行flush或close方法后,一级缓存会被清空. 二级缓存:二级缓 ...
- Mybaits动态Sql
什么是动态SQL? MyBatis的强大之处便是它的动态SQL,如果你使用JDBC那么在根据不同条件查询时,拼接SQL语句是多么的痛苦. 比如查询一个学生信息,可以根据学生的姓名,性别,班级,年龄,学 ...
- 1005:Number Sequence(hdu,数学规律题)
Problem Description A number sequence is defined as follows: f(1) = 1, f(2) = 1, f(n) = (A * f(n - 1 ...
- 【linux】Linux误删C基本运行库libc.so.6急救方法
转自:http://www.cnblogs.com/fjping0606/p/4551475.html 下面全文都是拷贝的上面链接的内容. 首先普及一下关于libc.so.6的基本常识: libc.s ...
- 《剑指offer》斐波那契数列
本题来自<剑指offer> 斐波那契数列 矩阵覆盖 题目一: 大家都知道斐波那契数列,现在要求输入一个整数n,请你输出斐波那契数列的第n项(从0开始,第0项为0).n<=39 思路: ...
- cf round546 cde
第一题会卡一下同时用set和cin.. 其他的注意下矩阵对角线下标的应用即可 #include<bits/stdc++.h> using namespace std; #define ma ...