我们先看一个简单的例子：
<input type="text" onblur="alert(this.value)"/>完全没有问题。
<wbr></wbr>
那么什么情况下不可以用？
fuction method()
{
<wbr><wbr> alert(this.value);</wbr></wbr>
}
<input type="text" onblur="method()"/>这个就不可以，因为method()是被响应函数调用的函数。
<wbr></wbr>
那么这种情况下怎么办？
<wbr></wbr>
方法一:
fuction method(btn)
{
<wbr><wbr> alert(btn.value);</wbr></wbr>
}
<input type="text" onblur="method(this)"/>没问题！
<wbr></wbr>
方法二：
fuction method()
{
<wbr><wbr> alert(window.event.srcElement.value);</wbr></wbr>
}
<input type="text" onblur="method()"/>没问题！window.event.srcElement取得触发事件的控件
<wbr></wbr>
我们在看一个稍微绕一点的例子
<head>
<wbr><wbr><wbr> <script type="text/javascript"><br><wbr><wbr><wbr><wbr><wbr><wbr><wbr> function InitEvent() {<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> var inputs = document.getElementsByTagName("input");<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> for (var i = 0; i < inputs.length; i++) {<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><strong>inputs[i].onblur = OnblurEvent;</strong><br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> }<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr> }</wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>
<wbr><wbr><wbr><wbr><wbr><wbr><wbr> function OnblurEvent() {<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><strong><span style="color:#ed1c24">// OnblurEvent是onblur的响应函数，而不是被响应函数调用的函数</span></strong><br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><span style="color:#ed1c24">
<strong>// 所以可以用this来获取发生事件的对象</strong></span><br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> if (this.value.length > 0) {<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> this.style.backgroundColor = "white";<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> }<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> else {<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> this.style.backgroundColor = "red";<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr><wbr> }<br><wbr><wbr><wbr><wbr><wbr><wbr><wbr> }<br><wbr><wbr><wbr> </script><br>
</head><br>
<body onload="InitEvent()"><br><wbr><wbr><wbr> <input id="Text1" type="text" /><br><wbr><wbr><wbr> <input id="Text2" type="text" /><br><wbr><wbr><wbr> <input id="Text3" type="text" /><br>
</body><br>
</html></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr></wbr>
<wbr></wbr>
正如红色注释解说，上面可以用this获得当前触发事件的input。
分享到：
相关推荐
在JavaScript编程中，`this`关键字和`window.event.srcElement`是两个非常重要的概念，它们在事件处理和函数上下文管理中扮演着重要的角色。对于JavaScript的初学者来说，理解这两个概念是十分必要的，因为这不仅...
- **IE事件模型**：IE中的事件是全局的，可以通过`window.event`来获取。 - **Firefox事件模型**：Firefox等现代浏览器中的事件是局部的，需要通过传递给事件处理函数的第一个参数来获取。 这种差异使得开发者在...
JavaScript 经典实例，涵盖了跨扫描器添加大事件、跨扫描器移除大事件、跨扫描器阻止默认行为、跨扫描器获取目标对象、跨扫描器获取滚动条位置、跨扫描器获取可视窗口大小、JS 对象冒充、JS 异步加载和同步加载等多...
案例1和案例2只是JavaScript表单事件应用的冰山一角，实际开发中还有更多如`onclick`、`onsubmit`、`onkeyup`等事件可供利用。掌握这些事件的使用，能够使网页更加动态、响应迅速，从而提升用户的整体体验。
event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode event.shiftKey event.altKey event.ctrlKey ...
1. `event.srcElement` 和 `event.target` 在IE中，事件对象的源元素属性是`srcElement`，而在Firefox和其他遵循W3C标准的浏览器中，这个属性是`target`。为了确保兼容性，可以使用如下代码： ```javascript var ...
ev = ev || window.event; /* We are setting target to whatever item the mouse is currently on Firefox uses event.target here, MSIE uses event.srcElement */ var target = ev.target || ev....
var srcElement = window.event.srcElement; console.log(srcElement); } ``` #### 5. 修改元素内容 - **`innerText`** - **用途**：设置或获取元素的文本内容。 - **语法**： ```javascript element....
var e = window.event || event; if (e.button == 2) { //... } }; ``` `Show`方法首先检查触发事件是否为鼠标右键点击（`e.button == 2`）。然后，它阻止了默认的浏览器右键菜单显示，并将自定义菜单的位置设置...
e = window.event; e.target = e.srcElement; e.layerX = e.offsetX; e.layerY = e.offsetY; } return e; } } window.onload = function(){ var obj = document.getElementById('draggable'); rDrag.init...
本文主要探讨了如何解决JavaScript浏览器兼容教程中的事件处理问题，包括`window.event`、键盘值的取得、事件源的获取、事件监听以及鼠标位置的获取。 1. **window.event** 在IE中，事件对象`event`可以直接通过`...
例如，上面的示例中分别处理了IE和其他浏览器的情况。 2. **用户体验**：在设计划词搜索功能时，需要考虑到用户体验，比如搜索框的样式、位置等都应当符合用户的使用习惯。 3. **安全性考虑**：确保用户选中的文本...
alert(window.event.srcElement === this); // true }; btn.attachEvent("onclick", function(event){ alert(event.srcElement === this); // false }); ``` 最后，`cancelBubble`属性仅阻止事件冒泡，不支持...
7. **window对象**：`window.event.srcElement.tagName`用于获取触发事件的元素标签名，`shiftKey`检查Shift键是否被按下。如果点击的元素是`<a>`标签并且Shift键被按住，程序会阻止默认行为，正确答案C。 8. **...
var rowIndex = window.event.srcElement.parentElement.parentElement.rowIndex + 1; // 获取当前行的索引 var newTr = categoryTable.insertRow(rowIndex); // 在指定位置插入一行 // 添加单元格并填充内容 //...
var target = e.target || window.event.srcElement; if (target.tagName.toLowerCase() === 'button') { // 执行相关操作 console.log('Button clicked!'); } }; ``` 这种方法不仅减少了事件监听器的数量，...
if (event.keyCode==13 && event.srcElement.type!=’button’ && event.srcElement.type! =’submit’ && event.srcElement.type!=’reset’ && event.srcElement.type!=’’&& event.srcElement.type!=’...
本文将围绕Firefox浏览器与Internet Explorer（简称IE）之间关于JavaScript脚本的兼容性差异进行详细探讨，并通过具体的示例来帮助开发者更好地理解和解决实际开发过程中遇到的问题。 #### 二、关键知识点详解 ###...