Js獲取事件對象代碼
更新時間:2010年08月05日 03:30:31 作者:
js下比較實用的事件綁定代碼,學(xué)習(xí)js 的朋友一定要學(xué)習(xí)的,為你的頁面增加更好的交互。
一般做法:
<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.dbjr.com.cn/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; //這里用對象檢測更為妥當(dāng)
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標(biāo)簽中 onclick="testFun_1()"),也不推薦使用這種方法,會造成維護和開發(fā)的麻煩。
復(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>
或者:
復(fù)制代碼 代碼如下:
<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]“。
但如果是這種方式呢?
復(fù)制代碼 代碼如下:
<input type="button" id="test_1" value="點我測試" onclick="testFun_1()" />
<script type="text/javascript">
function testFun_1()
{
//此處如何獲得?
}
</script>
“內(nèi)事不決問百度,外事不決問谷歌”, 此言不虛。搜索了下,答案還真不少,不過大多數(shù)雷同(可能是巧合)。
http://www.dbjr.com.cn/article/19408.htm
http://www.cnblogs.com/cuixiping/archive/2008/04/13/1150847.html
愚公 的這個文章(貌似轉(zhuǎn)帖)還是頗有見解的。
復(fù)制代碼 代碼如下:
<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; //這里用對象檢測更為妥當(dāng)
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標(biāo)簽中 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,冒泡,事件對象的應(yīng)用整理總結(jié)
相關(guān)文章
javascript 獲取網(wǎng)頁標(biāo)題代碼實例
這篇文章主要介紹了javascript 獲取網(wǎng)頁標(biāo)題代碼實例,有需要的朋友可以參考一下2014-01-01淺談JavaScript中等號、雙等號、 三等號的區(qū)別
這篇文章主要介紹了淺談JavaScript中等號、雙等號、 三等號的區(qū)別,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08bootstrap響應(yīng)式導(dǎo)航條模板使用詳解(含下拉菜單,彈出框)
這篇文章主要為大家詳細介紹了bootstrap響應(yīng)式導(dǎo)航條模板使用詳解,含下拉菜單,彈出框效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-11-11