Js獲取事件對象代碼
更新時間：2010年08月05日 03:30:31 作者：
js下比較實用的事件綁定代碼，學習js 的朋友一定要學習的，為你的頁面增加更好的交互。
一般做法：
<input type="button" id="test" value="點我測試" />
<script type="text/javascript">
var testBtn = document.getElementById('test');
testBtn.onclick = testFun;
function testFun(e)
{
var evt = e || window.event;
alert(evt);
}
</script>
或者：
<input type="button" id="test" value="點我測試" />
<script type="text/javascript">
var testBtn = document.getElementById('test');
if(window.addEventListener)
{
testBtn.addEventListener('click', testFun, false);
}
else if(window.attachEvent)
{
testBtn.attachEvent('onclick', testFun);
}
function testFun(e)
{
var evt = e || window.event;
alert(evt);
}
</script>
返回的值都是 “[object Event]“。
但如果是這種方式呢？
<input type="button" id="test_1" value="點我測試" onclick="testFun_1()" />
<script type="text/javascript">
function testFun_1()
{
//此處如何獲得？
}
</script>
“內(nèi)事不決問百度，外事不決問谷歌”， 此言不虛。搜索了下，答案還真不少，不過大多數(shù)雷同（可能是巧合）。
http://www.fzitv.net/article/19408.htm
http://www.cnblogs.com/cuixiping/archive/2008/04/13/1150847.html
愚公 的這個文章（貌似轉(zhuǎn)帖）還是頗有見解的。
<input type="button" id="test_1" value="點我測試" onclick="testFun_1()" />
<script type="text/javascript">
function testFun_1()
{
var evt = getEvent();
alert(evt);
}
function getEvent(){
if(window.event) return window.event; //這里用對象檢測更為妥當
func=getEvent.caller;
while(func!=null){
var arg0=func.arguments[0];
if(arg0){
if((arg0.constructor==Event || arg0.constructor ==MouseEvent)
|| (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){
return arg0;
}
}
func=func.caller;
}
return null;
}
</script>
一般來說，很少用到這種嵌入式的寫法（js寫在html標簽中 onclick="testFun_1()"），也不推薦使用這種方法，會造成維護和開發(fā)的麻煩。
復制代碼 代碼如下:
<input type="button" id="test" value="點我測試" />
<script type="text/javascript">
var testBtn = document.getElementById('test');
testBtn.onclick = testFun;
function testFun(e)
{
var evt = e || window.event;
alert(evt);
}
</script>
或者：
復制代碼 代碼如下:
<input type="button" id="test" value="點我測試" />
<script type="text/javascript">
var testBtn = document.getElementById('test');
if(window.addEventListener)
{
testBtn.addEventListener('click', testFun, false);
}
else if(window.attachEvent)
{
testBtn.attachEvent('onclick', testFun);
}
function testFun(e)
{
var evt = e || window.event;
alert(evt);
}
</script>
返回的值都是 “[object Event]“。
但如果是這種方式呢？
復制代碼 代碼如下:
<input type="button" id="test_1" value="點我測試" onclick="testFun_1()" />
<script type="text/javascript">
function testFun_1()
{
//此處如何獲得？
}
</script>
“內(nèi)事不決問百度，外事不決問谷歌”， 此言不虛。搜索了下，答案還真不少，不過大多數(shù)雷同（可能是巧合）。
http://www.fzitv.net/article/19408.htm
http://www.cnblogs.com/cuixiping/archive/2008/04/13/1150847.html
愚公 的這個文章（貌似轉(zhuǎn)帖）還是頗有見解的。
復制代碼 代碼如下:
<input type="button" id="test_1" value="點我測試" onclick="testFun_1()" />
<script type="text/javascript">
function testFun_1()
{
var evt = getEvent();
alert(evt);
}
function getEvent(){
if(window.event) return window.event; //這里用對象檢測更為妥當
func=getEvent.caller;
while(func!=null){
var arg0=func.arguments[0];
if(arg0){
if((arg0.constructor==Event || arg0.constructor ==MouseEvent)
|| (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){
return arg0;
}
}
func=func.caller;
}
return null;
}
</script>
一般來說，很少用到這種嵌入式的寫法（js寫在html標簽中 onclick="testFun_1()"），也不推薦使用這種方法，會造成維護和開發(fā)的麻煩。
您可能感興趣的文章:
- javascript的offset、client、scroll使用方法詳解
- js中top、clientTop、scrollTop、offsetTop的區(qū)別 文字詳細說明版
- js中的scroll和offset 使用比較的實例與分析
- javascript scrollLeft,scrollWidth,clientWidth,offsetWidth 完全詳解
- javascript中offset、client、scroll的屬性總結(jié)
- js之事件冒泡和事件捕獲詳細介紹
- 阻止JavaScript事件冒泡傳遞（cancelBubble 、stopPropagation）
- javascript事件冒泡詳解和捕獲、阻止方法
- js中獲取事件對象的方法小結(jié)
- JS的Event事件對象使用方法
- JS前端知識點offset，scroll，client，冒泡，事件對象的應用整理總結(jié)
相關(guān)文章
這篇文章主要是對Javascript中難以理解的11個問題進行了詳細的分析介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
這篇文章主要介紹了詳解用async/await來處理異步，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-08-08
這篇文章主要介紹了深入了解JavaScript代碼覆蓋 ,代碼覆蓋提供有關(guān)是否以及可選地應用程序的某些部分被執(zhí)行的頻率的信息。它通常用于判定一個測試套件執(zhí)行特定代碼庫的全面程度。,需要的朋友可以參考下2019-06-06
這篇文章主要為大家詳細介紹了JavaScript中文件上傳API，介紹了上傳文件API的使用方法，感興趣的小伙伴們可以參考一下2016-04-04
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)自定義底部導航，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11
這篇文章主要介紹了微信小程序拍照和攝像功能實現(xiàn)方法,結(jié)合實例形式分析了微信小程序拍照與攝影功能的原理、相關(guān)實現(xiàn)技巧與注意事項,需要的朋友可以參考下2019-02-02
這篇文章主要介紹了JS sort排序詳細使用方法示例解析,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-09-09
微信小程序?qū)崿F(xiàn)跳轉(zhuǎn)的幾種方式總結(jié)（推薦）
這篇文章主要介紹了微信小程序跳轉(zhuǎn)方式，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
為JS擴展Array.prototype.indexOf引發(fā)的問題探討及解決
Array沒有indexOf方法，這樣在一個數(shù)組中查找某個元素的索引時比較麻煩，于是通過prototype原型擴展了Array.prototype.indexOf(),在對數(shù)組進行遍歷的時候卻出現(xiàn)了問題2013-04-04
js 剪切板的用法(clipboardData.setData)與js match函數(shù)介紹
這篇文章主要是對js中剪切板的使用方法(clipboardData.setData)與js中的match函數(shù)進行了介紹。需要的朋友可以過來參考下，希望對大家有所幫助2013-11-11