$(document.documentElement).bind("click",function(e){
var e = e||window.event;
var o = e.srcElement?e.srcElement:e.target
if(o){
alert(o.tagName);
}
});
一个小例子
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<style type="text/css">
#mesg{
width:152px;
height:120px;
background:#ECEEFE;
border:1px solid #CED3FC;
display:none;
position:absolute;
}
.btn{
cursor:pointer;
}
</style>
<script type="text/javascript">
<!--
var m = {};
$(function(){
m={c:1,show:false,to:null,mesg:$("#mesg")[0]};
$(document.documentElement).bind("click",function(e){
if(m.show && m.c >=2){
var e = e||window.event;
var o = e.srcElement?e.srcElement:e.target;
if(o != m.to[0] && o !=m.mesg){
m.show=false;
$(m.mesg).hide();
}
}
m.c++;
});
$(".btn").bind("click",function(){
if(m.show){
m.show=false;
$(m.mesg).hide();
}else{
var mg = $("#mesg");
var to = $(this).prev();
var of = to.offset();
mg.css({"left":of.left,"top":of.top+20}).show();
m.show=true;
m.to=to;
m.c=1;
}
});
});
//-->
</script>
</head>
<body>
<input id="t1"/><image src="qq.jpg" class="btn" >
<input /><image src="qq.jpg" class="btn" >
<br/>
<br/>
<br/>
<br/>
<input /><image src="qq.jpg" class="btn">
<div id="mesg"></div>
</body>
</html>
分享到：
相关推荐
- IE使用document.body.offsetWidth和document.body.offsetHeight，FF使用window.innerWidth、window.innerHeight以及document.documentElement.clientWidth和document.documentElement.clientHeight。 - 通用做法...
在W3C事件模型中，可以通过`event.target`获取事件的目标元素，而在IE中则需要使用`window.event.srcElement`。`getTarget`函数封装了这个差异，返回事件的目标元素。 6. **获取滚动条位置**： 获取页面的滚动...
left: document.documentElement.scrollLeft || document.body.scrollLeft }; } ``` 跨扫描器获取可视窗口大小 在 JavaScript 中，获取可视窗口大小可以使用 `innerWidth` 属性或 `innerHeight` 属性。下面是一...
FF则使用`window.innerWidth`和`window.innerHeight`，以及`document.documentElement.clientWidth`和`document.documentElement.clientHeight`。通用方法是使用`document.body.clientWidth`和`document.body....
对于窗体的高度和宽度，IE使用`document.body.offsetWidth`和`document.body.offsetHeight`，但FF提供了`window.innerWidth`和`window.innerHeight`，以及`document.documentElement.clientWidth`和`document....
event.target : event.srcElement; }, addHandler: function(elem, type, listener) { if (elem.addEventListener) { elem.addEventListener(type, listener, false); } else if (elem.attachEvent) { elem....
兼容写法为`var target = e.relatedTarget || e.toElement`。 2. **标签坐标位置**：IE提供了style.posLeft和style.posTop，FF不支持。可以用obj.offsetLeft和obj.offsetTop作为通用属性。 3. **窗体尺寸**：IE...
- `event.srcElement`：事件触发的元素，与`event.target`类似，但在旧版本的IE中使用。 - `event.srcElement.tagName` 和 `event.srcElement.type`：获取元素的标签名和类型。 - `event.srcElement.setCapture()...
- **Firefox**: 使用 `window.innerWidth` 和 `window.innerHeight` 获取视口宽度和高度，或使用 `document.documentElement.clientWidth` 和 `document.documentElement.clientHeight` 获取文档元素的宽度和高度。...
e.srcElement : e.target; ``` 这段代码首先检查`srcElement`是否存在，如果存在则直接使用；否则，使用`target`。 #### 四、元素属性访问 对于元素属性的访问，IE和Firefox也有细微差别。例如，对于一个名为`...
document.documentElement.innerHTML 第一个style标签 document.styleSheets[0] style标签里的第一个样式 document.styleSheets[0].rules[0] 防止点击空链接时，页面往往重置到页首端。 ()">word 上一网页...
40. **HTML标签内容**：`document.documentElement.innerHTML`返回整个HTML文档的innerHTML。 41. **第一个style标签**：`document.styleSheets[0]`可以获取文档的第一个样式表。 这些技巧涵盖了JavaScript在网页...
var Y=window,T={innerHTML:""},N="document",H="documentElement",C="getElementsByTagName",V,A,S,G,c,X=navigator.appName;if(X=="Microsoft Internet Explorer")S=true;else if(X=="Opera")c=true;else G=true;A...
- 获取事件触发的对象: `event.srcElement` 或 `event.target` (推荐) - 获取标签名称: `event.srcElement.tagName` - 获取元素类型: `event.srcElement.type` 2. **事件按键** - 获取按键码: `event....
let targetEle = e.target || e.srcElement; for (let i = 0; i < child.length; i++) { if (child[i] == targetEle) { cb.call(targetEle)(); } } }; } ``` 3. **获取可视窗口大小**： `view`函数可以...
Document.prototype.documentElement = function(){ // 实现 document.documentElement 的功能 }; Document.prototype.activeElement = function(){ // 实现 document.activeElement 的功能 }; } ``` ##### ...
FF提供`window.innerWidth`和`window.innerHeight`，IE可能需要`document.documentElement.clientWidth`和`document.documentElement.clientHeight`。 - 解决方案：使用`obj.offsetLeft`和`obj.offsetTop`获取元素...
left: document.documentElement.scrollLeft || document.body.scrollLeft; }; } ``` 获取浏览器窗口可视大小是响应式设计中不可或缺的功能。`getWindow` 函数能够返回当前窗口的宽度和高度： ```javascript ...
pos.x = oEvent.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; pos.y = oEvent.clientY + document.body.scrollTop + document.documentElement.scrollTop; } console.log("X: " ...
Firefox 提供了 `window.innerWidth` 和 `window.innerHeight`，以及 `document.documentElement.clientWidth` 和 `document.documentElement.clientHeight`。这些属性可以获取到窗口或文档元素的实际可视区域大小。...