2011-06-16 107 views
10

我有一個帶有onchange事件的輸入文本,該事件調用顯示警告框的函數。我也有一個按鈕,其onclick調用不同的功能。如果用戶對輸入文本進行更改並立即單擊該按鈕,則會觸發onchange事件,並顯示警告框,但不會執行該按鈕的onclick函數中的代碼。我讀過這與事件冒泡有關,但我還沒有看到任何解決方案。有解決方案嗎?它甚至有可能嗎?當用戶立即點擊按鈕時onchange點擊onchange不會觸發

這裏是一個小例子:

<input type = "text" onchange = "showAlert1()"> 
<input type = "button" id = "al2" value = "Click Here" onclick = "showAlert2()"> 

<script type = "text/javascript"> 

function showAlert1() 
{ 
    alert("ONE") 
} 

function showAlert2() 
{ 
    alert ("TWO"); 
} 

</script> 

如果做出改變來輸入值和用戶立即點擊按鈕的onclick事件處理程序showAlert2()不火。 我想,你寫的東西輸入字段中,單擊按鈕立即和它激發

警報(「1」)和Alert(「二」)...

或僅

警報(「二」)

+0

試圖使用keyUp或代替的keyDown的onChange的? – Max 2011-06-16 12:44:46

+0

你不能使用事件onkeyup – Grumpy 2011-06-16 12:53:44

回答

2

至於我可以告訴它不是用鼓泡(這與onchange一個問題,但在這種情況下,一個紅色的鯡魚)的問題。問題是在更改字段值後單擊該按鈕會觸發blur,導致showAlert1()在按鈕的onclick被觸發之前運行。

下面是一個按照您描述的方式工作的簡單示例,但您會發現它比任何事情都更不可靠。基本上它會緩衝每個功能的執行,以便觸發按鈕的onclick。但是,如果單擊並按住比每個功能中設置的緩衝區長的按鈕(通過setTimeout()),則會發生此情況。

function showAlert1() { 
    setTimeout(function(){ alert("ONE") }, 250); 
} 

function showAlert2() { 
    setTimeout(function(){ alert("TWO") }, 250); 
} 

演示:jsfiddle.net/5rTLq

+0

好的,那是一種可能性。但是,這不是很好。 – ezebemmel 2011-06-17 10:25:55

1

這個怎麼樣

function showAlert1(a) { 
    alert(a.value); /* use setTimeout to delay */ 
} 

function showAlert2() { 
    alert(document.getElementById('txt').value); 
} 

測試:http://jsfiddle.net/C3jRr/2/

+0

這不是,我想要的是... – ezebemmel 2011-06-17 10:26:21

相關問題