2013-08-20 99 views
5

概述:onchange事件不火

我正在寫一個jQuery插件,它的文本框轉換成時間輸入框。這意味着它允許用戶以HH:MM格式輸入時間。這個過程的一部分是在正確的地方插入冒號(:)。在keyup上,我檢查用戶是否輸入了2個數字,如果是這樣,則在輸入的值上附加冒號。

問題:

這種方法工作得很好,當有人適用於文本框插件除外,但也希望有一個自定義的onchange handler.This onChange處理時的代碼更新文本框的值不火也不編程當文本框失去焦點時它會啓動嗎?

我的理解:

我猜在這裏,所以請糾正我,如果我錯了。

  • 也許文本框有一個內部"_value"(強調從公共值屬性 分化)的編輯開始之前保持在文本框中 值字段。當焦點離開文本框 時,JS引擎會檢查文本框 的當前值是否與文本框的"_value"匹配。如果它們不同,則會觸發該事件。
  • 使用普通原生鍵擊可能會改變數值,但不會修改 "_value"只是值,所以onchange被觸發。但也許 值更改通過JS修改值和"_value"和 所以onchange事件不會觸發?

的變通辦法:

模糊事件觸發,因爲它沒有任何關係與價值。所以我可以明確地從模糊事件中引發更改事件。但我不想這樣做,因爲它是黑客攻擊並打破了模糊和更改的語義。

相關鏈接:

我發現有這麼幾種鏈路使用相同的問題,但沒有答案(恕我直言)給出了一個優雅的或正確的解決方案。 這裏有一些我看到的國家:

簡化的代碼:

$(document).ready(function() { 
    $("input").keyup(function() { 
     this.value = '*' + this.value; 
     // this changes the value, but does not fire the onchange event 
     // and it also does not fire it when the textbox loses focus. 
     // blur fires though. 
    }); 
    $("input").change(function() { 
     alert('in change'); 
    }); 

    $("input").blur(function() { 
     alert('in blur'); 
    }); 
}); 

FIDDLE:

http://jsfiddle.net/sajjansarkar/vHgst/4/

瀏覽器上測試: IE8,10和Chrome。 在Firefox(!!)(+1費利克斯·克林)

+0

,如果設置'ele.value的變化不會觸發事件'是通常的行爲。僅供參考,在模糊輸入失去焦點後,Firefox中會觸發'change'事件。 –

+0

@FelixKling如果是平常的行爲,我該如何保留onchange行爲?有趣的觀察,它在FF工作,將編輯問題 –

回答

1

您可以jquery.trigger編程觸發事件: http://jsfiddle.net/vHgst/5/

$(this).trigger('change'); 
+0

是的,但是我什麼時候調用它來模仿正確的更改事件?你的例子會爲每個keyup調用onchange –